Cara Membuat Gallery

Tidak ada komentar












Pasang kode di bawah ini di HTML Blog agan

<style type="text/css">
div.gallery
{
  margin: 2px;
  border: 2px solid #D8D8D8;
  background-color:#ECECEC;
  height: auto;
  width: auto;
  float: left;
  text-align: center;
}  
div.gallery img
{
  height: 100px;
  width: 125px;
  display: inline;
  margin: 5px;
  border: 2px solid #ffffff;
}

div.gallery a:hover img
{
  border: 2px solid #000000;
  /* for IE */
  filter:alpha(opacity=40);
  /* CSS3 standard */
  opacity:0.4;
}

div.label
{
  border: 2px solid #D2D2D2;
  background-color:#ffffff;
  text-align: center;
  font-weight: normal;
  height: 40px;
  width: 120px;
  padding:3px;
  margin: 5px;
}

</style>

<div class="gallery">
<a target="_blank" href="#"><img src="http://4.bp.blogspot.com/-R4hODSxAtAQ/T45x_mFy4yI/AAAAAAAAAAs/y_ui5_rySvA/s200/RINGJOINT.jpg"/></a>
<div class="label">RING JOINT</div>
</div>

<div class="gallery">
<a target="_blank" href="#"><img src="http://1.bp.blogspot.com/-L7-u6Wi4MnQ/T4_IE9ngZTI/AAAAAAAAAE0/vLrjd_1OKkw/s200/GASKET_GT.jpg"/></a>
<div class="label">SPIRAL WOUND GASKET SS</div>
</div>

<div class="gallery">
<a target="_blank" href="#"><img src="http://2.bp.blogspot.com/-GJlq_qatzUk/T45HdGJ1MaI/AAAAAAAAAAU/dFtLiZuXm1A/s200/Spiral_Wound_Gasket.jpg"/></a>
<div class="label">SPIRAL WOUND GASKET CS</div>
</div>

<div class="gallery">
<a target="_blank" href="#"><img src="http://1.bp.blogspot.com/-KJy7uI7JQyE/T4_IKKxEvbI/AAAAAAAAAFM/SuOhEb1cdSw/s200/GASKET_TEFLON.jpg"/></a>
<div class="label">GASKET PAKING</div>
</div>

Note : Ganti Kode # dengan URl Tujuan Agan
          Ganti Warna merah Dengan URL gambar agan

Tidak ada komentar :

Posting Komentar

CHAT ON TV
CHAT NOW TV ONE


» Please download Adobe Flash Player « before watching the streaming