Bagaimana untuk menggunakan kedudukan dalam css

下次还敢
Lepaskan: 2024-04-26 11:00:22
asal
870 orang telah melayarinya

Atribut kedudukan dalam CSS digunakan untuk menentukan kedudukan elemen dalam aliran dokumen Nilai yang mungkin adalah: statik (lalai): elemen disusun dalam susunan biasa dalam aliran dokumen. relatif: Mengalihkan elemen pada jarak tertentu berbanding kedudukan asalnya, tetapi masih kekal dalam aliran dokumen. mutlak: Mengalih keluar elemen daripada aliran dokumen dan meletakkannya secara relatif kepada induk atau elemen akarnya. tetap: Memperbaiki elemen dalam port pandangan penyemak imbas supaya ia tidak akan bergerak walaupun halaman itu ditatal.

Bagaimana untuk menggunakan kedudukan dalam css

Penggunaan kedudukan dalam CSS

Harta kedudukan mentakrifkan kedudukan elemen dalam aliran dokumen HTML dan elemen sekeliling. Ia boleh menentukan sama ada elemen itu statik, relatif, mutlak atau tetap.

1. statik (lalai)

Kedudukan statik ialah kedudukan lalai, dan elemen menduduki ruang biasa dalam aliran dokumen.

2. relatif

Kedudukan relatif menggerakkan elemen pada jarak tertentu dari kedudukan normalnya tanpa mengeluarkannya daripada aliran dokumen.

3. mutlak

Kedudukan mutlak mengalih keluar elemen daripada aliran dokumen dan meletakkannya berdasarkan unsur induk atau akarnya.

4. tetap

Kedudukan tetap membetulkan elemen dalam port pandangan penyemak imbas dan tidak akan bergerak walaupun halaman itu ditatal.

Penggunaan

Sintaks atribut kedudukan adalah seperti berikut:

<code class="css">position: value;</code>
Salin selepas log masuk

Di mana, nilai boleh menjadi salah satu nilai berikut:

  • statik
  • relative
  • relative
  • abute

Contoh

Contoh di bawah Letakkan elemen div secara relatifnya 10px ke kanan:

<code class="css">div {
  position: relative;
  right: 10px;
}</code>
Salin selepas log masuk
Contoh berikut meletakkan elemen div secara mutlak di penjuru kanan sebelah bawah halaman:

<code class="css">div {
  position: absolute;
  bottom: 0;
  right: 0;
}</code>
Salin selepas log masuk
Nota:
  • boleh dengan elemen kedudukanOnly
  • tetapkan Atribut kiri, kanan, atas dan bawah.
  • Elemen yang diposisikan secara relatif menduduki ruang dalam aliran dokumen, manakala elemen yang diposisikan secara mutlak tidak.
  • Elemen kedudukan tetap tidak akan bergerak semasa halaman ditatal, tetapi akan menjejaskan kedudukan elemen lain.
🎜

Atas ialah kandungan terperinci Bagaimana untuk menggunakan kedudukan dalam css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!