HTML & CSS: Border

Border adalah CSS rule yang bisa digunakan untuk mengatur 'garis' luar dari sebuah elemen. Warna, ukuran, gaya dan posisi adalah properti dari border. Sebagai contoh, jika ingin membuat sebuah elemen memiliki border berwarna hitam putus-putus dengan ukuran 2 pixel, kita bisa menggunakan CSS border:2px dashed black; Contoh:

border:2px dashed black;

Secara defaut, kode 'border:..;' akan mengelilingi sebuah elemen. Tapi tidak ada batasan kalau kita ingin menaruh border di satu sisi saja atau ingin menggunakan border dengan tipe, warna atau ukuran yang berbeda pada sisi elemen. Kode untuk border bagian atas adalah: 'border-top:...;', kanan: 'border-right:...;', bawah: 'border-bottom:...;' dan kiri: 'border-left:...;'. Pada contoh dibawah, saya menggunakan border dengan properti yang berbeda-beda pada setiap sisinya:

border-top:2px lime dashed;

border-right:none;

border-bottom:1px red dotted;

border-left:5px blue solid; 

Pada diagram dibawah, border ditandai dengan warna biru. Posisinya tepat di ujung dari elemen.

Diagram Elemen