Rumah >hujung hadapan web >tutorial css >Apakah atribut kedudukan dalam css

Apakah atribut kedudukan dalam css

下次还敢
下次还敢asal
2024-04-26 13:39:20987semak imbas

Sifat penentududukan dalam CSS digunakan untuk mengawal kedudukan elemen berbanding dengan induknya atau elemen lain. Atribut kedudukan utama termasuk: statik: Elemen menduduki kedudukan dalam aliran dokumen biasa. relatif: Elemen diimbangi secara relatif kepada kedudukan semasanya tetapi kekal dalam aliran dokumen. mutlak: Elemen dialih keluar daripada aliran dokumen dan diletakkan relatif kepada elemen induk terdekatnya yang mempunyai atribut kedudukan. tetap: Elemen ditetapkan dalam port pandangan dan diposisikan relatif kepada tetingkap penyemak imbas.

Apakah atribut kedudukan dalam css

Kedudukan sifat dalam CSS

Sifat penentududukan ialah sifat utama dalam CSS yang digunakan untuk mengawal kedudukan elemen dalam dokumen. Ia digunakan terutamanya untuk menentukan kedudukan unsur relatif kepada induknya atau unsur lain.

Jenis atribut kedudukan yang berbeza

Atribut kedudukan utama berikut disediakan dalam CSS:

  • statik: Elemen menduduki kedudukan dalam aliran dokumen biasa dan tidak dipengaruhi oleh atribut kedudukan. Ini ialah atribut penyasaran lalai.
  • relatif: Elemen diimbangi berbanding kedudukan semasanya tetapi kekal dalam aliran dokumen.
  • mutlak: Elemen dikeluarkan daripada aliran dokumen dan diletakkan secara relatif kepada elemen induk terdekatnya yang mempunyai atribut kedudukan.
  • dibetulkan: Elemen dibetulkan dalam port pandangan, diposisikan relatif kepada tetingkap penyemak imbas dan tidak bergerak walaupun apabila halaman itu ditatal.

Contoh penentududukan

Contoh kod berikut menunjukkan penggunaan sifat kedudukan yang berbeza:

<code class="css">/* static定位 */
p {
  color: blue;
}

/* relative定位 */
div {
  position: relative;
  top: 20px;
  left: 50px;
}

/* absolute定位 */
span {
  position: absolute;
  top: 0;
  right: 0;
}

/* fixed定位 */
nav {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
}</code>

Ini akan mencipta perenggan teks biru (kedudukan statik), div mengimbangi 20px atas dan 50px kiri berbanding kedudukannya sendiri ( kedudukan relatif), rentang kedudukan relatif kepada bahagian atas dan kanan elemen induknya (kedudukan mutlak), dan bar navigasi yang ditetapkan pada bahagian atas dan kiri halaman (kedudukan tetap).

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

Kenyataan:
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
Artikel sebelumnya:Apakah unit vw dalam css?Artikel seterusnya:Apakah unit vw dalam css?