Kode CSS Box Terang Gelap .mybox{ position:relative; display:block; width:200px; max-height:400px; background:#fff; color:#000; overflow:auto; padding:20px 15px; margin:20px 5px; border:2px solid #777; border-radius:6px; opacity:0.2; filter:alpha(opacity=20); transition:1s; -o-transition:1s; -moz-transition:1s; -webkit-transition:1s; } .mybox:hover{ opacity:1.0; filter:alpha(opacity=100); } xHTML <div class="mybox"> Letakkan teks, image atau yang lainnya di sini! </div> xHTML dengan tag p <p class="mybox"> Letakkan teks, image atau yang lainnya di sini! </p> Contoh xHTML <div class="mybox"> <a href="http://..../images/myphoto.jpg" title="my photo"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrtHpnMjU0ZfKGrtBNrCzP7Zaq24kxMXAYUQxk1hJfC-9ttcyXRWrDnLc0F93s6v7dY-lBp9KZFhhAXSdmznygIFzkRaWKc-ty8vRB8WSKZ4i0uzS8O0TncuMyRpVOsKATDsdJuZAlkVE/s320/myphoto.jpg" width="200" height="150" style="float:left;margin:5px 10px 5px 0;padding:3px;border:2px solid #222;border-radius:6px;" /></a>Photo masa kecilku ketika main petak umpet kemudian tiba-tiba kebelet e'ok! </div> Cara membuat Box dengan Efek Terang - Gelap Login ke Blogger Dasboard Design (Rancangan) Edit HTML Cari kode ]]></b:skin> Letakkan kode CSS di atas kode ]]></b:skin> Klik Save Template Gunakan xHTML di halaman posting atau di sidebar blog. box gelap_terang (fade effeck)

Kode CSS Box Terang Gelap
.mybox{
position:relative;
display:block;
width:200px;
max-height:400px;
background:#fff;
color:#000;
overflow:auto;
padding:20px 15px;
margin:20px 5px;
border:2px solid #777;
border-radius:6px;
opacity:0.2;
filter:alpha(opacity=20);
transition:1s;
-o-transition:1s;
-moz-transition:1s;
-webkit-transition:1s;
}
.mybox:hover{
opacity:1.0;
filter:alpha(opacity=100);
}

xHTML
<div class="mybox">
Letakkan teks, image atau yang lainnya di sini!
</div>

xHTML dengan tag p
<p class="mybox">
Letakkan teks, image atau yang lainnya di sini!
</p>

Contoh xHTML
<div class="mybox">
<a href="http://..../images/myphoto.jpg" title="my photo"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrtHpnMjU0ZfKGrtBNrCzP7Zaq24kxMXAYUQxk1hJfC-9ttcyXRWrDnLc0F93s6v7dY-lBp9KZFhhAXSdmznygIFzkRaWKc-ty8vRB8WSKZ4i0uzS8O0TncuMyRpVOsKATDsdJuZAlkVE/s320/myphoto.jpg" width="200" height="150" style="float:left;margin:5px 10px 5px 0;padding:3px;border:2px solid #222;border-radius:6px;" /></a>Photo masa kecilku ketika main petak umpet kemudian tiba-tiba kebelet e'ok!
</div>

Cara membuat Box dengan Efek Terang - Gelap
Login ke Blogger
Dasboard
Design (Rancangan)
Edit HTML
Cari kode ]]></b:skin>
Letakkan kode CSS di atas kode ]]></b:skin>
Klik Save Template
Gunakan xHTML di halaman posting atau di sidebar blog.