CSS Tutorial : Pengertian Dari Display. Apa Itu Display Dalam CSS ?

7

Hai Semuanya...Okey, Sebenernya Saya Agak Bingung Penjelasannya Tentang Display. Mendingan Anda Mengambil Kesimpulan Sendiri...

Berikut Contoh2nya...



Display: Block

Contoh Penggunaan :
span {
display: block;
}
HTML :
<span>Saya membuat blog ini Pada : </span>
<span>2011</span>

Hasil
:
Saya membuat blog ini Pada :
2011

Jika tidak Mengunakan Display: Block :
Saya membuat blog ini Pada : 2011



Display: Inline

Contoh Penggunaan :
li {
display: inline;
}
HTML :
<ul>
<li>WEB</li>
<li>CSS</li>
<li>PHP</li>
<li>HTML</li>
</ul>

Hasil :
  • WEB
  • CSS
  • PHP
  • HTML



Display: None

Contoh Penggunaan :
h2.q {
display: none;
}
Efeknya adalah html tersebut akan menghilang dan di anggap tidak ada...
Beda dengan Visibility: hidden

Contoh penggunaan :
h2.p {
visibility: hidden;
}
HTML :
<h2>Mengggunakan visibility: hidden;</h2>
<h2 class="p">Tulisan Tidak terlihat</h2>
<h2>Terlihat..??</h2>

Hasil :

Mengggunakan visibility: hidden;

Tulisan Tidak terlihat

di tengah..Terlihat..??


Bedanya Yang ini Tetap dianggap Ada...



Gimana Gampang Kan...???