Belajar CSS Align

By Adhi P. - Last updated: Monday, March 5, 2012 - Save & Share - Comments

banner438kursus Belajar CSS Align

Materi belajar css kali ini adalah property css align. Yang akan kita bahas adalah horizontal align. Kenapa horizontal align? Karena didalam css beberapa property menggunakan elemen align horizontal. Fungsi dari align itu sendiri adalah untuk membuat perataan.

Elemen Align Block

Elemen block merupakan elemen yang mengambil keseluruhan lebar yang tersedia. Dan memiliki satu baris sebelum dan sesudahnya. Contoh dari blok elemen adalah :

Center Align menggunakan property margin

Block elemen dapat dijadikan align dengan mengatur kiri dan kanan margin menggunakan “auto” , dengan catatan kalau menggunakan margin align tidak dapat bekerja kalau menggunakan browser IE, kecuali mengikutkan deklarasi !DOCTYPE

Mengatur margin kiri dan kanan ke “auto” berbarti bahwa mereka membagi sama margin yang tersedia Contoh kodenya :


.center

{

margin-left:auto;

margin-right:auto;

width:70%;

background-color:#b0e0e6;

}

 

Left dan Right Align menggunakan property position

Salah satu metode align dengan menggunakan absolute position :


.right

{

position:absolute;

right:0px;

width:300px;

background-color:#b0e0e6;

}

 

Align Left dan Right menggunakan property float

Salah satu metode align adalah dengan menggunakan property float, kodenya :

.right

{

float:right;

width:300px;

background-color:#b0e0e6;

}

Ok, kita sudah membahas metode-metode dalam mengatur align. Semakin mudah bukan dalam mempelajari css? Jangan lupa untuk terus belajar caranya dengan membuat beberapa versi seperti yang telah dicontohkan diatas, dicoba di notepad dan dilihat hasilnya menggunakan browser.

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

 

Posted in Belajar CSS • Tags: , Top Of Page