Tutorial : Keluar Text Di Image Lepas Dihover

Assalamualaikum semua :)

Enna request tutor semalam macam mana nak buat text keluar lepas hover image..Sebelum tu, Anis nak credit to Kak Atiqah sebab Anis dapat kode tu dari blogskin Snow Pink :) Template Designer Anis tak tau menahu kode nya macam mana sebab Anis bukannye pakar dalam cipta kod2 ni .. so Sorry Enna ..

ATTENTION !!! FOR BLOGSKIN ONLY.

Bukak Template.

Tekan Ctrl+f, cari kode </style>

Jumpa kan ? Copy kode bawah ni pulak, paste dekat ATAS </style>.

#text{
background:#8c8c8c;
color:#FFABC0;
font-family: consolas;
width:230px;
height:142px;
margin-top:-147px;
padding-left:0.5px;
padding-right:0.5px;
padding-bottom:0.5px;
padding-top:5px;
opacity:.1;
-webkit-transition:all .5s ease-in-out; }
#text:hover{opacity:.7}

Pink : warna korang ubah suke hati..kode warna di >> sini .. Belum habis lagi, teruskan dengan no.3
Kalau korang nak letak dekat sidebar korang, copy kode warna kuning ni pastu paste lah dekat kode sidebar korang, ohh, ni memang agak susah nak terangkan .. Rujuk je lah kode sidebar Anis kasi ni k :)

<div class="main-title">Le` Boss</div><br>
<center><img height="195" src="http://data.whicdn.com/images/31175793/tumblr_m2oyd9oBa01rtqv69o2_500_large.gif" width="240" /><br>
<div id="text"><br>
<center>Your Words Here</center></div></div><br><center>
<br>

Harap korang faham, preview kalau menjadi Save . Oh, ada banyak lagi hover2 image ni .. nak lagi ? Tengok blog Afiqah ni .. di sini  |  di sini  |  di sini  |  di sini
Bai :) Hari ni aku tak pergi kelas Prep .. dan aku terase keganjalannye ..

---

THANKS FOR READING. DROP YOUR COMMENT PLEASE?

---