 |
| Galeri Foto dengan HTML |
Gallery Foto atau gambar di blog memang banyak sekali kita jumpai pada halaman Blog yang mengutamakan Promosi melalui gambar maupun foto image, biasanya dipasang pada widget blog situs jual beli Online. Untuk trik membuat gallery foto gambar bergerak berjalan di blog, Caranya sangat mudah sekali. Ukuran lebar dan tinggi foto atau gambar bisa di atur sesuai dengan keinginan anda.
Contoh code html nya :
<!DOCTYPE HTML>
<html>
<head>
<title>Galeri Foto</title>
<link type="text/css" rel="stylesheet" href="picture.css">
</head>
<body>
<table id="tablemenu">
<tr><td colspan="3" align="center"><h3 >MULTIMDIA MOMENT </h3></td></tr>
<tr>
<td align="center" >
<a href="#" target="_blank">
<img src="images/8.jpg" alt="menu CAPTURE" width="190" >
</a>
<h5>CAPTURE 1</h5>
</td>
<td align="center">
<a href="" target="_blank">
<img src="images/d.jpg" alt="menu CAPTURE" width="190" >
</a>
<h5>CAPTURE 2</h5>
</td>
<td align="center">
<a href="" target="_blank">
<img src="images/o.jpg" alt="menu CAPTURE" width="190" >
</a>
<h5>CAPTURE 3</h5>
</td>
</tr><tr>
<td align="center">
<a href="" target="_blank">
<img src="images/s.jpg" alt="menu CAPTURE" width="190" >
</a>
<h5>CAPTURE 4</h5>
</td>
<td align="center"><a href="" target="_blank">
<img src="images/q.jpg" alt="menu CAPTURE" width="190" >
</a>
<h5>CAPTURE 5</h5>
</td>
<td align="center">
<a href="" target="_blank">
<img src="images/12.jpg" alt="menu CAPTURE" width="190" >
</a>
<h5>CAPTURE 6</h5>
</td>
</tr>
</table>
</body>
</html>
Berikut contoh kode css nya:
#tablemenu {
background-color:#ffffff;
border:#c1c8ec 2px solid;
padding:5px;
-moz-border-radius:5px;
border-radius: 10px;
}
#tablemenu td {
border:#ffffff 1px solid;
padding:5px;
}
#tablemenu td:hover {
border:#c1c8ec 1px solid;
-moz-border-radius:5px;
background-color:#9DACBF;
color:gray;
border-radius: 7px;
}
#tablemenu img {
border:#ffffff 5px solid;
-moz-border-radius:5px;
background-color:#ffffff;
}
#tablemenu h5 {
margin:0px;
color:gray;
}
#tablemenu h3 {
margin:0px;
color:#000000;
-moz-border-radius:5px;
background-color:#dce2fb;
border-radius: 10px;
padding:5px;
}
Tantangan Menjadi Master Komputer, Belajar Komputer hanya di asianbrilliant.com belajar komputer via online.
1000 Guru datang ke rumah untuk mengajar anak-anak anda hanya di smartsukses.com, Bimbingan Belajar, Les Private Solusi Les Private Keluarga Indonesia
TERIMA KASIH ATAS KUNJUNGAN SAUDARA
Anda Ingin Kursus Mastering Komputer ?
KLIK DISINI
Judul: Membuat Galeri Foto dengan HTML
Ditulis oleh Unknown
Rating Blog 5 dari 5
Semoga artikel ini bermanfaat bagi saudara. Jika ingin mengutip, baik itu sebagian atau keseluruhan dari isi artikel ini harap menyertakan link dofollow ke http://tips-triks-ilmu-komputer.blogspot.com/2014/09/membuat-galeri-foto-dengan-html.html. Terima kasih sudah singgah membaca artikel ini.Ditulis oleh Unknown
Rating Blog 5 dari 5
Anda Ingin Kursus Mastering Komputer ?
KLIK DISINI
0 komentar:
Posting Komentar