Belajar CSS Dimension, Display & Visibility

By Adhi P. - Last updated: Monday, February 27, 2012 - Save & Share - Comments

banner438kursus Belajar CSS Dimension, Display & Visibility

Dalam materi belajar css seri lalu kita membahas tentang grouping dan nesting, sekarang kita akan belajar tentang dimension dan display. Dalam property css dimension memungkinkan kita untuk mengatur tinggi dan lebar suatu elemen. Berikut ini ada macam-macam property css dimension :

 

Kita tidak akan membahas banyak soal dimension karena sudah banyak dibahas di property-property yang lain, kita langsung belajar css display dan visibility. Properti display dan visibility ini biasanya digunakan untuk menampilkan atau menyembunyikan object di dalam halaman HTML.

Untuk Display mempunyai 2 property yang utama yaitu:

Contoh kode :


h1.hidden {display:none;}

Sedangkan untuk Visibility juga mempunyai 2 property yang dapat diset nilainya yaitu:

Contoh kode :


h1.hidden {visibility:hidden;}

Perbedaan diantara keduanya mungkin tidak begitu menyolok, namun hanya masalah space saja, dimana jika kita menambahkan space pada bagian yang akan dihilangkan, penggunaan style visibility:hidden akan tetap memunculkan space tersebut.

misalnya kita akan membuat sebuah trigger yang akan memunculkan dan menyembunyikan gambar ataupun object lainnya. Dapat kita tuliskan sebagai berikut:


function changeme(id, action) {

if (action==”hide”) {

document.getElementById(id).style.display = “none”;

} else {

document.getElementById(id).style.display = “block”;

}

}

Try This: 4 Langkah Mudah Belajar Cara Membuat Website, Langsung Praktek! KLIK DI SINI!.

Nah, anda bisa mencoba kode-kode diatas. Jangan berhenti untuk belajar css yaa.. karena masih banyak yang perlu dipelajari. Seri berikutnya akan kita bahas css positioning.

 

Posted in Belajar CSS • Tags: Top Of Page