divcsshide

Div CSS Hide

Dalam pembangunan web, selalunya perlu untuk menyembunyikan beberapa elemen. Yang biasa termasuk menyembunyikan pop timbul, menu lungsur, bar sisi, dsb. Terdapat banyak cara untuk mencapai fungsi ini Hari ini kita akan belajar cara menggunakan CSS untuk menyembunyikan elemen.

Dalam CSS, terdapat dua sifat yang biasa digunakan yang boleh digunakan untuk menyembunyikan elemen: paparan dan keterlihatan. Kaedah penggunaannya sedikit berbeza, mari kita bincangkan secara berasingan di bawah.

1. atribut paparan

Atribut paparan boleh mengawal mod paparan elemen, termasuk sama ada untuk memaparkannya, cara untuk memaparkannya, dsb. Antaranya, paparan: tiada siapa yang boleh menyembunyikan elemen sepenuhnya tanpa menduduki sebarang kedudukan atau ruang. Apabila menggunakan atribut ini, elemen tidak muncul pada halaman dan tidak boleh diakses melalui JavaScript.

Seterusnya mari kita lihat cara menggunakan atribut paparan untuk menyembunyikan elemen:

<!-- HTML 代码 -->
<div id="element">这是一个元素</div>

/* CSS 代码 */
#element {
  display: none;
}

Kod di atas menggunakan atribut paparan untuk menyembunyikan elemen dengan id elemen. Elemen ini tidak muncul pada halaman dan tidak mengambil sebarang ruang. Untuk membuat paparan semula elemen, hanya tetapkan sifat paparan kepada nilai yang berbeza.

Selain paparan: tiada, atribut paparan juga mempunyai nilai lain, seperti inline, block, inline-block, dsb., yang boleh dipilih mengikut situasi sebenar. Dalam contoh berikut, kami menukar mod paparan elemen dengan menukar nilai atribut paparan:

<!-- HTML 代码 -->
<div id="element">这是一个元素</div>

/* CSS 代码 */
#element {
  display: inline-block;
}

Kod di atas menetapkan atribut paparan elemen dengan id elemen kepada sekatan sebaris, yang ialah, elemen Tahap blok sebaris dipaparkan. Ambil perhatian bahawa elemen di sini hanya tersembunyi dan dipaparkan, tidak dipadam sepenuhnya.

2. atribut keterlihatan

Atribut keterlihatan juga boleh mengawal paparan dan penyembunyian elemen, tetapi tidak seperti atribut paparan, elemen yang disembunyikan menggunakan atribut keterlihatan masih akan menduduki ruang. Cuma tak nampak. Untuk situasi di mana anda memerlukan elemen untuk menduduki ruang dalam kedudukan asalnya tetapi tidak dipaparkan, anda boleh menggunakan atribut keterlihatan.

Berikut ialah contoh menggunakan atribut keterlihatan untuk menyembunyikan elemen:

<!-- HTML 代码 -->
<div id="element">这是一个元素</div>

/* CSS 代码 */
#element {
  visibility: hidden;
}

Kod di atas menggunakan atribut keterlihatan untuk menyembunyikan elemen dengan elemen id, tetapi elemen masih menempati kedudukan pada halaman. Seperti atribut paparan, atribut keterlihatan juga mempunyai nilai lain, seperti boleh dilihat (nilai lalai, menunjukkan bahawa elemen boleh dilihat) dan runtuh (digunakan untuk elemen jadual, menunjukkan bahawa sel tersembunyi dan digabungkan), dsb.

3. Kesimpulan

Melalui atribut paparan dan atribut keterlihatan, kita boleh merealisasikan fungsi paparan dan menyembunyikan elemen dengan mudah. Penggunaan atribut ini tidak terhad kepada menyembunyikan elemen, tetapi juga boleh digunakan untuk melaraskan mod paparan dan gaya elemen, dsb., dengan fleksibiliti yang tinggi. Apabila membangunkan halaman web, anda boleh membuat pilihan yang fleksibel berdasarkan keperluan anda.

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