Ini adalah cara membuat kotak warna ( highlight box ) untuk kode HTML di postingan blog, terkadang kita ingin membuat kode html dan tulisan artikel terpisah dengan sebuah kotak, baik itu kotak scroll maupun dengan warna yang kita inginkan.
Silahkan pilih dibawah ini :

Silahkan masukan kode script/tulisan anda disini
<div style="border: 0; padding: 10px; background-color: #82CAFA; text-align: left;"> Silahkan masukan kode script/tulisan anda disini </div>
2. kotak simpel warna jingga
Silahkan masukan kode script/tulisan anda disini
<div style="border: 2px #5f200e solid; padding: 10px; background-color: #d9da81; text-align: left;"> Silahkan masukan kode script/tulisan anda disini </div>
3. Kotak dengan garis 1
Silahkan masukan kode script/tulisan anda disini
<div style="border: 3px #5f200e outset; padding: 10px; background-color: #d9da81; text-align: left;"> Silahkan masukan kode script/tulisan anda disini</div>
4. kotak dengan garis 2
Silahkan masukan kode script/tulisan anda disini
<div style="border: 2px #006400 inset; padding: 10px; background-color: #d5839f; text-align: left;"> Silahkan masukan kode script/tulisan anda disini</</div>
5. kotak dengan garis luar
Silahkan masukan kode script/tulisan anda disini
<div style="border: 2px #006400 ridge; padding: 10px; background-color:#c2c2c2; text-align: left;"> Silahkan masukan kode script/tulisan anda disini</div>
6. Kotak dengan garis dobel
Silahkan masukan kode script/tulisan anda disini
<div style="border: 3px #5f200e double; padding: 10px; background-color: #82CAFA; text-align: left;"> Silahkan masukan kode script/tulisan anda disini</div>
7. kotak dengan garis putus putus
Silahkan masukan kode script/tulisan anda disini
<div style="border: 2px #610B38 dashed; padding: 10px; background-color:#57AA52; text-align: left;"> Silahkan masukan kode script/tulisan anda disini</div>
8. kotak dengan garis putus putus
Silahkan masukan kode script/tulisan anda disini
<div style="border: 2px #1B1A76 dotted; padding: 10px; background-color:#c2c2c2; text-align: left;"> Silahkan masukan kode script/tulisan anda disini</div>
9. kotak dengan scroll
<div style="border: 2px #006400 solid; padding: 10px; background-color: #82CAFA; overflow: auto; height: 50px; width: 400px; text-align: left;"> Silahkan masukan kode script/tulisan anda disini </div>
<div style="border: 2px #006400 solid; padding: 10px; background-color: #82CAFA; overflow: auto; height: 50px; width: 400px; text-align: left;"> Silahkan masukan kode script/tulisan anda disini </div>
ket : 400px : adalah lebar kotak
50px : adalah tinggi kotak
0 Komentar untuk "Cara membuat kotak warna ( highlight box ) / scroll box untuk kode HTML di postingan blog"