Membuat Bingkai/Border Posting

Banyak bentuk bingkai yang bisa anda pakai dan dibawah adalah contoh-contoh bentuk bingkai beserta kodenya yang support di WordPress.com.

Solid

<div style="background-color: #222222; border: 1px solid #000000; padding: 5px; width: 400px;">
Tulisan Anda...
</div>

Dashed

<div style="border: 1px dashed #000000; background-color:#D8E7F6; padding: 5px; width: 400px;">
Tulisan Anda...
</div>

Dotted

<div style="background-color: #d8e7f6; border: 1px dotted #000000; padding: 5px; width: 400px;">
Tulisan Anda...
</div>

Double

<div style="background-color: #d8e7f6; border: 1px double #000000; padding: 5px; width: 400px;">
Tulisan Anda...
</div>

Groove

<div style="border: 4px groove #000000; background-color:#d8e7f6; padding: 5px; width: 400px;">
Tulisan Anda...
</div>

OutSet

<div style="border: 4px outset #000000; background-color:#d8e7f6; padding: 5px; width: 400px;">
Tulisan Anda...
</div>

Ridge

<div style="border: 4px ridge #000000; background-color:#d8e7f6; padding: 5px; width: 400px;">
Tulisan Anda...
</div>

Keterangan :

border: tebal tipisnya, jenis dan warna bingkai.
background-color: warna latar bingkai.
padding: jarak antar bingkai dengan tulisan.
padding: width: lebar bingkai.

Read more »

Bingkai/Border Melengkung

<div style="-moz-border-radius: 12px 12px 12px 12px; background-color: #e6e6e6; border: 2px solid rgb(204, 204, 204); color: black; height: auto; margin: 10px 0px; padding: 10px; text-align: left; width: auto;">

Hasil CodeScript

</div>

<div style="-moz-border-radius-bottomleft: 12px ; background-color: #e6e6e6; border: 2px solid rgb(204, 204, 204); color: black; height: auto; margin: 10px 0px; padding: 10px; text-align: left; width: auto;">

Hasil CodeScript

</div>

<div style="-moz-border-radius-bottomright: 12px ; background-color: #e6e6e6; border: 2px solid rgb(204, 204, 204); color: black; height: auto; margin: 10px 0px; padding: 10px; text-align: left; width: auto;">

Hasil CodeScript

</div>

dan sebagainya

Keterangan
>> -moz-border-radius => ini akan membuat segala sudut jadi melengkung,
baik itu kiri atas, kiri bawah, kanan atas dan kanan bawah
>> -moz-border-radius-bottomright => ini membuat garis melengkung kanan bawah
>> -moz-border-radius-bottomleft => ini di gunakan untuk membuat garis kiri bawah melengkung
>> -moz-border-radius-topright => ini untuk garis melengkung kanan atas
>> -moz-border-radius-topleft => ini untuk garis melengkung bagian kiriatas
background-color : warna background

Read more »