Cara Membuat Bingkai dan Warna Pada Blog

Biasanya bingkai ini digunakan untuk memberi tanda pada kode-kode HTML atau tulisan-tulisan yang ingin ditonjolkan atau di pertegas agar lebih terlihat sekaligus untuk mempercantik blog agar terlihat lebih rapi.Atau seperti yang saya terapkan pada kotak Daftar isi di samping kiri ini..
Berikut ini adalah kodenya dan diletakkan diatas atau sebelum kode tulisan sobat.

<div style="background:#F2F2F2;border:3px dashed #000000; padding:5px;">
Tulisan yang sudah sobat buat
</div>


Keterangan: 
Yang berwarna biru adalah kode warna, seperti:
#3366FF         : warna Biru muda
#003DF5        : warna Biru tua
#FF33CC       : warna Pink Muda
#CC33FF       : warna Ungu
#FF6633        : warna Orange
#B88A00       : warna Coklat
#FFCC33       : warna kuning
#33FF66        : warna hijau tua
#CCFF33       : warna Hijau Muda


Dan tulisan Dashed pada kode diatas adalah menunjukkan jenis bingkainya seperti:
Dashed        : bingkai berbentuk garis putus-putus
Double         :Bingkai garis double line atau kotak dua garis
Dotted         :Bingkai berupa Titik-titik


Dan tulisan yang berwarna hijau pada kode diatas adalah warna bingkai tersebut, seperti,
 #000000      Bingkai warna Hitam, untuk mengganti warna yang lain sobat bisa lihat seperti kode warna yang ada di atas.
Semoga info ini bisa bermanfaat buat sobat yang ingin mempercantik blog

Cara Membuat Bingkai Pada Tulisan atau Gambar

Apabila sobat ingin membingkai setelah membuat beberapa tulisan atau gambar yang ditampilkan pada blog agar kelihatan sedikit rapi, sobat bisa mengikuti langkah-langkah yang saya bagikan ini, dibawah ini adalah  kode-kode untuk bingkai berbetuk Border dan Overflow
Sobat tinggal menambahkan kode ini diatas  kode tulisan sobat.
Berikut adalah kodenya:

Bingkai bentuk Border:
<div style="border: 1px solid #CCC; margin: 10px 0px; padding: 10px; width: auto; height: auto; background-color:#FBFBEE; text-align: left;">

Tulisan yang sudah kamu buat

</div>

 Bingkai bentuk Overflow:

<div style="overflow:auto; border: 1px solid #CCC; margin: auto; padding: 3px; width: 95%; height: 100px; background-color: none; text-align: left;">

Tulisan yang sudah kamu buat

</div>

Catatan: tulisan yang berwarna merah adalah isi dari tulisan atau kode postingan yang sobat sudah buat, dan untuk angka-angkanya  bisa di edit  sesuai dengan kebutuhan  sobat .