Lokasi Absolut CSS
- Hal Sebelumnya Lokasi Relatif CSS
- Hal Berikutnya Gelugur CSS
Boks elemen yang diatur untuk pemilihan lokasi absolut akan dihapus sepenuhnya dari alur dokumen dan ditempatkan terhadap blok yang mengandung, blok yang mengandung mungkin adalah elemen lain di dokumen atau blok yang mengandung awal. Ruang yang diambil elemen sebelumnya di alur dokumen akan ditutup, seperti jika elemen itu tidak pernah ada. Setelah lokasi elemen disesuaikan, akan dihasilkan boks tingkat blok, tanpa mengira tipe boks yang dihasilkan elemen di alur biasa.
Lokasi Absolut CSS
Pemilihan lokasi absolut membuat lokasi elemen tak berhubungan dengan alur dokumen, sehingga tak mengambil ruang. Ini berbeda dengan pemilihan lokasi relatif, yang sebenarnya dianggap sebagai bagian dari model pemilihan lokasi alur biasa, karena lokasi elemen berdasarkan posisinya di alur biasa.
Objek lain di alur biasa seperti jika tak ada elemen yang ditempatkan secara absolut:
#box_relative {
position: absolute;
left: 30px;
top: 20px;
}
seperti yang ditunjukkan di gambar di bawah:
posisi elemen yang dialokasikan absolut 'relatif' kepadaelemen penyangga yang paling dekat yang dialokasikanjika elemen tidak memiliki elemen penyangga yang dialokasikan, posisi mereka 'relatif' kepadaBlok penggabungan awal.
Pertanyaan penting untuk mengingat makna setiap lokasi adalah untuk mengulang kembali ilmu yang telah dipelajari: lokasi relatif adalah 'relatif' kepada posisi asli elemen di dokumen, sedangkan lokasi absolut adalah 'relatif' kepada родительский элемент yang terdekat yang telah dialokasikan, jika tidak ada elemen yang dialokasikan yang ada, 'relatif' kepada blok penggabungan awal.
Komentar:Berdasarkan peran agen pengguna yang berbeda, blok penggabungan awal mungkin kanvas atau elemen HTML.
Petunjuk:Karena kotak lokasi absolut tidak berhubungan dengan aliran dokumen, jadi mereka dapat menutupi elemen lain di halaman. Dapat disetel melalui Atribut z-indexUntuk mengawasi urutan penyanggaing kotak ini.
Contoh Lokasi Absolut CSS
- Lokasi: Lokasi Absolut
- Contoh ini menunjukkan bagaimana untuk menggunakan nilai absolut untuk memposisikan elemen.
- Hal Sebelumnya Lokasi Relatif CSS
- Hal Berikutnya Gelugur CSS
