Cara tetapkan border/kurungan pada tulisan atau gambar dll.

Untuk tetapkan border, gnakan kod
1. border-width, (luas/tebal garisan kurungan)
2. border-style, dan (cara border, contoh: titik, Solid, putus2)
3. border-color properties. (warna border)


Contoh;

<p style="border-width:1px;border-style:solid;border-color:blue;"><br /> Test ini telah disuaikan dengan menggunakan border-width, border-style, dan border-color properties.</p>


hasil;

Test ini telah disuaikan dengan menggunakan border-width,
border-style, dan border-color properties.

Cara tulis kod border tadi (brder-width, border-style, border-colour) guna satu kod ringkas.


<p style="border:1px solid blue;"><br /> This text has border styles applied using the border property.<br /></p>



hasilnya;

This text has border styles applied using the border property.

Style atau jenis2 border


<br /><p style="border:4px solid blue;">This text has a border style of 'solid'.</p><br /><p style="border:4px dotted blue;">This text has a border style of 'dotted'.</p><br /><p style="border:4px dashed blue;">This text has a border style of 'dashed'.</p><br /><p style="border:4px double blue;">This text has a border style of 'double'.</p><br /><p style="border:4px groove blue;">This text has a border style of 'groove'.</p><br /><p style="border:4px ridge blue;">This text has a border style of 'ridge'.</p><br /><p style="border:4px inset blue;">This text has a border style of 'inset'.</p><br /><p style="border:4px outset blue;">This text has a border style of 'outset'.</p><br /><p style="border:4px hidden blue;">This text has a border style of 'hidden'.</p><br />


hasil;

This text has a border style of 'solid'.

This text has a border style of 'dotted'.

This text has a border style of 'dashed'.

This text has a border style of 'double'.

This text has a border style of 'groove'.

This text has a border style of 'ridge'.

This text has a border style of 'inset'.

This text has a border style of 'outset'.

This text has a border style of 'hidden'.

Setting Borders for Each Side

Kalau nak beberapa tempat sahaja yg terkesan dgn borde,gna kod ni:

* border-bottom-color (warna border dibawah sahaja)
* border-bottom-style (style atau jenis border bawah sahaja)
* border-bottom-width (lebar border bawah sahaja)

Kiri sahaja
* border-left-color
* border-left-style
* border-left-width

Kanan sahaja
* border-right-color
* border-right-style
* border-right-width

Atas sahaja
* border-top-color
* border-top-style
* border-top-width