Cara membuat kotak di Blog

 Rumah Jasa Tutorial,  Berbagi berbagai tutorial
Cara membuat kotak di blog. adalah sesuatu yang umum di sampaikan dalam tutorial para peblogger. tapi ada juga para peblogger yang belum tau caranya, oke sekarang akan saya kasih tau cara membuat Script kotak di blog.
yang harus di perhatikan adalah kode di bawah ini:

Tutorial membuat kotak di blog

Tampilan di atas scriptnya adalah:

<div style="border: 3px #FF8C00 solid; padding: 10px;background-color:#ffffff;
text-align: left;">
Tutorial membuat kotak di blog</div>

kita juga bisa merubah style garisnya :
contohnya seperti ini :

Tutorial membuat kotak di blog, kode Solid di atas tinggal kita ganti dengan kata dotted

Tutorial membuat kotak di blog, kode Solid di atas tinggal kita ganti dengan kata dashed

Tutorial membuat kotak di blog, kode Solid di atas tinggal kita ganti dengan kata outset

Tutorial membuat kotak di blog, kode Solid di atas tinggal kita ganti dengan kata double

Ada lagi cara agar garis tersebut bisa berbentuk double. caranya mudah tinggal kita memasukkan kode salah satu dai atas di antara kode <div STYle>masukkan script garis ke 2 disini</div>

berikut salah satu contoh membuat kotak dobel di blog.:

Tutorial cara membuat kotak di blog

Contoh di atas kodenya adalah seperti berikut:

<div style="background-color: white; border: 6px #FF8C00 solid; padding: 10px; text-align: left;">
<div style="border: 3px #8B0000 dotted; padding: 10px;">
Tutorial cara membuat kotak di blog</div></div>

Sekarang untuk memperindah tampilan kita rubah warna background kotak kita dengan cara merubah kode warna pada script background: berikut :

Tutorial membuat kotak di blog

di bawah ini adalah kode untuk mengganti baackground kotak kita, kita tinggal ganti "background-color: white" dengan "background-color: blue"

<div style="background-color: blue; border: 3px #FF8C00 solid; padding: 10px; text-align: left;">
<span style="color: #b45f06;"><b>Tutorial membuat kotak di blog </b></span></div>

Tahap berikutnya adalah membuat kotak dengaan Scroll. caranya sangat mudah. Kita tinggal menambahkan overflow : auto; height; dan width

bagussulistijono.blogspot.com bagussulistijono.blogspot.com
bagussulistijono.blogspot.com bagussulistijono.blogspot.com
bagussulistijono.blogspot.com bagussulistijono.blogspot.com
bagussulistijono.blogspot.com bagussulistijono.blogspot.com
bagussulistijono.blogspot.com

Hasil dari kotak di atas adalah kumpulan dari script di bawah ini :

<div style="border: 3px #1780dd solid; padding: 10px;background-color:#ffffff;
overflow: auto; height: 80px; width: 380px;
text-align: left;">
pelajarterbaikupi.blogspot.com</div>

Demikian tutorial dari saya tentang cara membuat kotak di blog semoga bermanfaat buat semua, jangan lupa tinggalkan komentar karena peblogger yang baik akan senantiasa memberikan kritik dan saran kepada peblogger lain .