Home » » Membuat Galeri Foto Dengan CSS

Membuat Galeri Foto Dengan CSS

Siang ini saya akan memberikan suatu Trik and Tip yang sangat sederhana meskipun cuacanya agak panas. tapi semangat untuk berbagi kesahabat blogger tetap berjalan sebagaimana mestinya.


Nah Trik kali ini Cara Membuat Galeri Foto dengan CSS, Mungkin ada sahabat yang masih belum tau bagaimana cara membuatnya. Santai...Santai....Santai (Kata Bung Rhoma) Lora Malunk Akan memberikan Trik dan Tipnya.


Lihat Dulu dan di teliti Cewek-cewek dibawah ini. ada yang menarik. Silahkan Diklik Fotonya.




Klematis

Kumpulan Foto Dian Pelangi

Klematis

Dian Pelangi Artis Model

Klematis

Kumpulan Foto Nabila Syakieb

Klematis

Foto Terbaru Aura Kasih













Kalau Sudah Melihat DEMONYA, Langsung saja :

Langkah 1
Copy Paste Kode dibawah ini ke Gadget (HTML/JavaScript), Bisa juga di pasang ke dalam Postingan.



<html>
<head>
<style type="text/css">
div.img
{
margin:2px;
border:1px solid #0000ff;
height:auto;
width:auto;
float:left;
text-align:center;
}
div.img img
{
display:inline;
margin:3px;
border:1px solid #ffffff;
}
div.img a:hover img
{
border:1px solid #0000ff;
}
div.desc
{
text-align:center;
font-weight:normal;
width:120px;
margin:2px;
}
</style>
</head>
<body>

<div class="img">
<a target="_blank" href="Lora-malunk_big.htm">
<img src="klematis_small.jpg" alt="loramalunkblog" width="110" height="90" />
</a>
<div class="desc">Add a description of the image here</div>
</div>
<div class="img">
<a target="_blank" href="Lora-malunk_big.htm">
<img src="klematis2_small.jpg" alt="loramalunkblog" width="110" height="90" />
</a>
<div class="desc">Add a description of the image here</div>
</div>
<div class="img">
<a target="_blank" href="Lora-malunk_big.htm">
<img src="klematis3_small.jpg" alt="loramalunkblog" width="110" height="90" />
</a>
<div class="desc">Add a description of the image here</div>
</div>
<div class="img">
<a target="_blank" href="Lora-malunk_big.htm">
<img src="klematis4_small.jpg" alt="loramalunkblog" width="110" height="90" />
</a>
<div class="desc">Add a description of the image here</div>
</div>

</body>
</html>



Langkah 2
Ingat...! Jangan asal Copy Paste dibaca dan diteliti dulu sebelum anda melakukan Trik ini.

Langkah 3
Tulisan yang saya cetak TEBAL anda ganti
1. Yang Berwarna Hitam : Ganti dengan URL Iklan/Postingan anda
2. Yang Berwarna Biru : Ganti dengan URL Gambar
3. Yang Berwarna Merah : Ganti description sesuka anda





Jika Anda menyukai Artikel di blog ini, Silahkan klik disini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di Lora Malunk Blog
tutorial blog up to date
Loading...

+ komentar + 4 komentar

30 Oktober 2011 10.15

keren bngt sobat galeri css ini, jadi kepengen pasang juga di blog sobat,,,

Terimakasih Asis Sugianto atas Komentarnya di Membuat Galeri Foto Dengan CSS
31 Oktober 2011 00.09

Mantab kali kawan tipsnya !

Terimakasih Prapatan Kertek atas Komentarnya di Membuat Galeri Foto Dengan CSS
31 Oktober 2011 11.55

Kalau mau mengatur jarak (tampilan) antar gadget yg kita gunakan dalam template? Thx

Terimakasih Ririe Khayan atas Komentarnya di Membuat Galeri Foto Dengan CSS
31 Oktober 2011 22.04

tukar link sobat

Terimakasih Dian18 atas Komentarnya di Membuat Galeri Foto Dengan CSS

Posting Komentar

Kebijakan berkomentar akan dihapus, jika tidak sesuai dengan aturan dibawah ini, Demi kenyamanan kita bersama :

» Menggunakan bahasa yang tidak sopan (Sara, Pornografi, Menyinggung)
» Duplikat komentar
» Komentar menautkan link secara langsung
» Komentar tidak berkaitan dengan artikel
» Judul Komentar Berupa Promosi

Terima Kasih .... Lora Malunk Blog

 

Configurasi

Alexa :
Stats :
Page Rank : Free PageRank Checker
DMCA :
Amung :
Bloggers : Bloggers - Meet Millions of Bloggers
Extreme :
eXTReMe Tracker
Support : Lora Malunk Blog | Songong Template | Tutorial Blog
Copyright © 2011. Lora Malunk Blog - All Rights Reserved
Template Modify by Lora Malunk Blog
Proudly powered by Blogger