Rumah  >  Artikel  >  hujung hadapan web  >  Bolehkah Anda Gunakan `kedudukan: mutlak` Tanpa Menetapkan `atas`, `kiri`, `bawah` atau `kanan`?

Bolehkah Anda Gunakan `kedudukan: mutlak` Tanpa Menetapkan `atas`, `kiri`, `bawah` atau `kanan`?

Mary-Kate Olsen
Mary-Kate Olsenasal
2024-11-07 09:18:03532semak imbas

Can You Use `position: absolute` Without Setting `top`, `left`, `bottom`, or `right`?

Kedudukan: Mutlak Tanpa Menetapkan Atas/Kiri/Bawah/Kanan?

Dalam CSS, kedudukan: sifat mutlak membenarkan anda mengalih keluar elemen daripada aliran dokumen biasa , menjadikannya diposisikan secara mutlak berbanding bekasnya. Walau bagaimanapun, kadangkala anda mungkin mahu menggunakan kedudukan: mutlak tanpa menetapkan nilai eksplisit untuk sifat atas, kiri, bawah atau kanan.

Kes #1:

Satu senario di mana pendekatan ini boleh berguna ialah apabila anda ingin meletakkan elemen relatif kepada elemen lain dalam bekas yang sama. Sebagai contoh, anda mungkin mahu meletakkan logo di atas foto dalam pengepala, seperti yang ditunjukkan dalam contoh HTML dan CSS di bawah:

<a>
#logo {
  position: absolute;
  margin: 10px;
  /* or padding: 10px; */
  /* or border: 10px solid transparent; */
}

Dalam contoh ini, menetapkan kedudukan: mutlak tanpa menyatakan nilai tertinggi meletakkan logo 10px di atas foto, menggunakan jidar atas foto sebagai titik rujukan.

Kes #2:

Satu lagi contoh di mana teknik ini mungkin berguna ialah apabila bekerja dengan jadual- susun atur berasaskan. Sebagai contoh, anda mungkin ingin mencipta menu berbilang peringkat mendatar yang merangkumi keseluruhan lebar bekas. Oleh kerana sel jadual tidak menyokong kedudukan: relatif, anda boleh menggunakan kedudukan: mutlak tanpa nilai atas/kiri/bawah/kanan seperti yang ditunjukkan di bawah:

<table>
#menu td {
  position: absolute;
  height: 100%;
  width: 100%;
}

Dalam senario ini, kedudukan: harta mutlak tanpa sebarang nilai tambahan meletakkan setiap sel dalam jadual berbanding dengan sempadan jadual, membolehkan anda mencipta menu berbilang peringkat mutlak yang sejajar dengan lancar.

Mengikut Piawaian CSS:

Secara amnya, Spesifikasi CSS menyatakan bahawa jika sifat atas/bawah atau kiri/kanan ditetapkan kepada auto, ia harus lalai kepada kedudukan elemen: nilai statik. Walau bagaimanapun, adalah penting untuk ambil perhatian bahawa pelaksanaan penyemak imbas mungkin berbeza dalam sokongannya untuk kedudukan mutlak tanpa menetapkan nilai atas/kiri/bawah/kanan secara eksplisit.

Atas ialah kandungan terperinci Bolehkah Anda Gunakan `kedudukan: mutlak` Tanpa Menetapkan `atas`, `kiri`, `bawah` atau `kanan`?. 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