Cara menggunakan top dalam css

Sifat teratas dalam CSS digunakan untuk menetapkan jarak mengimbangi elemen berbanding bahagian atas elemen induknya, menggerakkan elemen itu ke atas atau ke bawah. Penggunaan: 1. Tentukan nilai panjang (seperti "px", "em" atau "rem"); mewarisi unsur induk .

Penggunaan atribut teratas dalam CSS

Apakah atribut teratas? Sifat

atas digunakan untuk menetapkan jarak mengimbangi unsur berbanding bahagian atas unsur induknya. Ia menggerakkan elemen ke atas atau ke bawah.

Penggunaan:

atas Sintaks atribut adalah seperti berikut:

<code>top: <length> | auto | initial | inherit;</code>

Di mana:

• <length>: Tentukan nilai panjang ", seperti "px", seperti "px" em" atau "rem" ". <length>：指定一个长度值，如 "px"、"em" 或 "rem"。
• auto：将元素定位在其父元素的顶部或底部，具体取决于元素的定位类型。
• initial：将元素的 top 属性重置为其初始值。
• inherit：从父元素继承 top 属性值。

何时使用 top 属性？

top 属性通常用于以下情况：

• 创建重叠元素
• 将元素垂直对齐
• 创建垂直菜单或导航栏
• 控制元素在页面上的位置

示例：

以下示例将 <div> 元素相对于其父元素顶部向下移动 50px：

div {
  top: 50px;
}

以下示例将 <div>

auto: Letakkan elemen di bahagian atas atau bawah elemen induknya, bergantung pada jenis kedudukan elemen.

awal: Menetapkan semula atribut teratas elemen kepada nilai awalnya.

warisi: Warisi nilai atribut teratas daripada elemen induk.

• Bila hendak menggunakan atribut atas? Atribut
atas biasanya digunakan untuk:

🎜🎜Membuat elemen bertindih 🎜🎜Menjajarkan elemen secara menegak 🎜🎜Mencipta menu menegak atau bar navigasi 🎜🎜Mengawal kedudukan elemen 🎜🎜Mengawal kedudukan elemen pada halaman 🎜🎜 🎜Contoh di bawah mengalihkan elemen <div> ke bawah 50px berbanding bahagian atas elemen induknya: 🎜

div {
  top: -20%;
}

🎜Contoh berikut mengalihkan elemen <div> ke atas relatif ke bahagian bawah elemen induknya Pindahkan 20%: 🎜rrreee🎜🎜Petua: Atribut 🎜🎜🎜🎜atas juga boleh digunakan dengan nilai negatif, yang menggerakkan elemen ke atas. Sifat 🎜🎜atas sering digunakan bersama dengan sifat kedudukan lain seperti kiri, kanan, dan bawah untuk mengawal kedudukan sesuatu elemen dengan tepat. 🎜🎜Apabila elemen diletakkan secara mutlak, atribut teratas adalah relatif kepada elemen induk kedudukan terdekatnya. 🎜🎜

Atas ialah kandungan terperinci Cara menggunakan top dalam css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!