Menampilkan kode HTML/Javascript yang unik di postingan (4)

Satu lagi cara menampilkan kode HTML-an / javascript di postingan dengan menggunakan teknik scrollbox yaitu kode HTML-an di dalam kotak yang ada scrollnya, kalau sobat sudah membaca postingan bagaimana caranya menampilkan kode HTML/javascsript versi 1, versi 2, dan versi 3 tidak ada salahnya mencoba versi yang ke-4 ini, contohnya dapat di lihat di bawah ini :

#rec { margin:20px;padding:20px;}
.hint {
border: 1px solid #4AB7FF;
font-size: 11px;
color: #191919;
background: #BFE5FF url(http://i280.photobucket.com/albums/kk162/mochal_nl_2008/info.gif) no-repeat 5px center;
font-family: Verdana, sans-serif, "Courier New";
line-height: 125%;
margin: 5px 0px 0px;
padding: 12px 12px 12px 40px;
display: block;
font-weight: 400;
width: 85%;
}

Mau tahu cara buatnya?

Sobat hanya perlu menaruh kode HTML-an di dalam kode di bawah ini :

<div style="width: 395px; height: 400px; background-color: a0ffff; color: 000000; font-family: arial; font-size: 12px; text-align: left; border: 0px solid 00000; overflow: auto; padding: 4px;">Paste what you want to appear in the scroll box here</div>


Perhatikan text warna merah dan biru, untuk width, height, dan color sesuaikan dengan template sobat!!

Sangat simple dan mudah pengaplikasiannya, dan bila sobat terlalu pusing untuk menghapal penulisan kode tersebut, maka saya sarankan untuk ke Setting >> Formatting >> Post Template silahkan paste kode tersebut, agar memudahkan sobat blogger ketika ingin menggunakan kode tersebut. Semoga tutorial ringan ini dapat membantu sobat.