12/31/2013

Everything about border for newbies

12/31/2013

Assalamualaikum,

So yea saya buat benda ni sebab saya selalu post code tanpa terangkan apa yang boleh diubah. Perangai seperti ni tak ubah seperti cikgu akaun saya pada tahun lepas, hampeh tak faham. Mungkin ada yang tak tahu kan?  Tapi takpe, meh belajar. Ni ikut apa yang saya tau jelah, banyak sangat yang saya tak tau , maaf T_T (so den buat research sikit)

property border:

ketebalan :



jenis border:

Jenis dia ada banyak, boleh rujuk bawah ni :

dotted


dashed


solid


double ( 3px keatas )


groove ( 3px keatas )


ridge ( 3px keatas )


inset


outset


warna border :

Code warna, boleh ambik dari sini -> http://hexcolorgenerator.com/


border-width, border-style dan border-color




Property Border:1px solid #000000; dekat atas ni sebenarnya combinasi code  border-width, border-style dan border-color. Kalau nak guna property border-width, border-style dan border-color dalam css pun boleh, tapi ketiga-tiga property kena letak.

contoh :

border-width:10px;
border-color:#FFBBBB;
border-style:solid;


Yang bestnye guna property border-style ni, kita boleh guna sampai empat style !


border-style: solid dotted;
border-style: (atas dan bawah) (kiri dan kanan);

border-style: solid dotted dashed;
border-style: (atas) (kiri dan kanan) (bawah);

border-style: solid dotted dashed groove ;
border-style: (atas) (kanan) (bawah) (kiri) ;


Border-color pun, boleh guna sampai empat warna.

border-color:#FFBBBB #DACBEF;
border-color: (atas dan bawah) (kiri dan kanan);

border-color:#FFBBBB #DACBEF #F1EBC8;
border-color: (atas) (kiri dan kanan)(bawah) ;

border-color:#FFBBBB #DACBEF #F1EBC8 #C8E9F1;
border-color: (atas) (kanan) (bawah) (kiri) ;


Sorry kalau tak faham sebab saya selalu syok sendiri. Hihi. Sebarang soalan, boleh komen :) Wasalam

Mohon jangan repost tanpa kebenaran.

 rujukan rujukan