How To : Memasang Tulisan Dalam Gambar CSS

Kadang untuk menghemat tempat atau bagian di halaman website kita perlu menampilkan tulisan di dalam sebuah gambar. Ini dapat di tangani dengan mengcostumize CSS dan HTML.  Berikut saya mencoba tutorial lama semoga bermanfaat :

pertama kita coba membuat css :

.image {
 position:relative;
 float:left; /* optional */
}
.image .text {
 position:absolute;
 left:0px;
 width:100%; /* optional, though better have one */
 background-color:black;
 color:white;
 bottom: 0;
 opacity:0.8;
 filter:alpha(opacity=80);

sekarang kita buat HTMLnya

  
Nah Lho! Privasi Pengguna FB Tak Aman

Berukut Hasilnya :