Sifat visibility

Sifat visibility menetapkan ketidaklihatan kepada elemen. Pada masa yang sama, semua elemen lain akan berkelakuan seolah-olah elemen tersebut tidak hilang ke mana-mana.

Sintaks

csspemilih {
  visibility: visible atau hidden atau collapse;
}

Nilai

Nilai Keterangan
visible Elemen kelihatan.
hidden Elemen menjadi tidak kelihatan, seolah-olah lutsinar dan pada masa yang sama terus mengambil bahagian dalam pemformatan halaman.
collapse Jika menggunakan collapse untuk kandungan sel jadual, maka ia seolah-olah hilang, dan jadual dibina semula.
Jika nilai ini digunakan bukan untuk baris atau lajur jadual, maka hasil penggunaannya akan sama seperti hidden.

Nilai lalai: visible.

Contoh

Mari kita buat supaya teks perenggan pertama pada asalnya tidak kelihatan, tetapi apabila kursor dihalakan ke butang 'Show text' kita boleh membacanya:

html<button>Show text</button>
<div class="text">text1</div>
<div>text2</div>
cssdiv{
  border: 1px solid black;
  width: 100px;
}
.text {
  visibility: hidden;
}
button:hover + .text {
  visibility: visible;
}

Результат:

Lihat juga

  • sifat opacity,
    yang menetapkan ketelusan kepada elemen
  • atribut hidden,
    yang menyembunyikan elemen dari halaman