&"/> &">
cari

Rumah >hujung hadapan web >tutorial css >Kedudukan relatif menggunakan CSS

Kedudukan relatif menggunakan CSS

PHPz
PHPzke hadapan
2023-08-27 15:13:021279semak imbas

使用 CSS 进行相对定位

Kedudukan relatif menukar kedudukan elemen HTML berbanding kedudukan paparan biasanya. Jadi "kiri:20" menambah 20 piksel pada kedudukan KIRI elemen.

Anda boleh menggunakan dua nilai atas dan kiri bersama-sama dengan atribut untuk mengalihkan elemen HTML ke mana-mana kedudukan dalam dokumen HTML.

  • Bergerak ke kiri - Gunakan nilai negatif untuk kiri.
  • Bergerak ke kanan - Gunakan nilai positif untuk kiri.
  • Naik -Gunakan nilai negatif untuk bahagian atas.
  • Bergerak ke bawah - Gunakan nilai positif di bahagian atas.

Contoh

Anda boleh cuba jalankan kod berikut untuk mencapai kedudukan relatif -

<html>
   <head>
   </head>
      <body>
         <div style = "position:relative;left:80px;top:2px;background-color:yellow;">
            This div has relative positioning.
         </div>
      </body>
</html>

Atas ialah kandungan terperinci Kedudukan relatif menggunakan CSS. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

css html li
Kenyataan：
Artikel ini dikembalikan pada:tutorialspoint.com. Jika ada pelanggaran, sila hubungi admin@php.cn Padam
Artikel sebelumnya：Bagaimana untuk menetapkan kedudukan asas unsur yang diputar dalam CSS?Artikel seterusnya：Bagaimana untuk menetapkan kedudukan asas unsur yang diputar dalam CSS?

Artikel berkaitan

Lihat lagi