Bagaimana untuk menggunakan kedudukan dalam h5

Menggunakan atribut kedudukan dalam H5 boleh mengawal kaedah kedudukan elemen melalui CSS: 1. Kedudukan relatif, sintaksnya ialah "style="position: relative;"; 2. Kedudukan mutlak, sintaksnya ialah "style="position: mutlak;"; 3. Kedudukan tetap, sintaksnya ialah "style="position: fixed;" dan seterusnya

Sistem pengendalian tutorial ini: sistem Windows 10, komputer Dell G3

Dalam H5 (. HTML5). , gunakan atribut kedudukan untuk mengawal kedudukan elemen melalui CSS Berikut ialah beberapa contoh penggunaan kedudukan dalam H5:

1. Kedudukan relatif (relatif):

<div style="position: relative; top: 10px; left: 20px;">
  这是相对定位的元素
</div>

Elemen div dalam kod di atas akan menjadi relatif. ke kedudukan aliran dokumennya, mengimbangi 10 piksel ke bawah dan 20 piksel ke kanan

2. Kedudukan mutlak (mutlak):

<div style="position: absolute; top: 50px; right: 0;">
  这是绝对定位的元素
</div>

Elemen div dalam kod di atas akan diposisikan berbanding dengan elemen nenek moyangnya yang terdekat. 50 piksel dari atas dan 0 piksel dari tepi kanan

3. Kedudukan tetap (tetap):

<div style="position: fixed; bottom: 0; right: 0;">
  这是固定定位的元素
</div>

Elemen div dalam kod di atas akan diletakkan secara relatif kepada tetingkap penyemak imbas dan sentiasa kekal di bahagian bawah dan kanan. .

dengan menetapkan atribut kedudukan dan atribut kedudukan yang sepadan (seperti atas, kanan, bawah, kiri), anda boleh mencapai kesan kedudukan elemen yang berbeza dalam H5. Ingat untuk meletakkan kod CSS dalam teg gaya atau dalam helaian gaya luaran supaya ia berkesan sepanjang halaman

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