Membuat color box dan scroll box di postingan blog

color box adalah kotak yang memiliki background atau warna atau gambar
dan bisa di isi dengan kode script/html.
    
Scroll box adalah kotak yang berisi tulisan atau gambar atau lainnya yang menggunkan fungsi scroll. Selain gambar dan tulisan, sobat dapat mengisi scroll box tersebut dengan kode script / html. Memasang scroll box sangat bermanfaat sekali untuk kalian yang ingin membuat Linklist / blogroll agar panjang blogroll tersebut tidak membuat loading blog kita lambat. Untuk membuatnya, cukuplah mudah. Sobat hanya tinggal memasang kode Html di bawah ini:

- color box

<div style="border: 3px #1780dd Double; padding: 10px;background-color:#ffffff;
text-align: left;">
isi box</div>

penjelasan:

• border: 3px = ketebalan kotak script. dan #1780dd = warna kotak script.
• Double; = Bentuk kotak, bisa diganti dengan,
  
  dashed
  dotted
  Double
  Groove
  inset
  outset
  ridge
• Padding:10px = panjang kotak ke bawah, untuk lebarnya otomatis sampai ke ujung posting.
• background-color:ffffff; = warna dalam kotak. 
• Dan text-align:left; = posisi tulisan didalam kotak di kiri.

- scrool box

tambahkan script ini

<div style="overflow:auto;width:300px;height:100px;padding:10px;border:1px solid #eee">

Isi Scroll Box

</div>

contoh script blog

<div style="overflow:auto;width:100px;height:50px;padding:10px;border:1px solid #eee">

<a href="http://c--tech.blogspot.co.id/">scroll 1</a>

<br />

<a href="http://c--tech.blogspot.co.id/">scroll 2</a>

<br />

<a href="http://c--tech.blogspot.co.id/">scroll 3</a>

<br />

<a href="http://c--tech.blogspot.co.id/">scroll 4</a>

<br />

<a href="http://c--tech.blogspot.co.id/">scroll 5</a>

<br />
</div>

nanti jadinya akan seperti ini

scroll 1
scroll 2
scroll 3
scroll 4
scroll 5

atur width dan height nya ajah yah untuk melebar dan meninggikan box
sekian terima kasih

Share this

Share on FacebookPlus on Google+