CSS Gallery

For create attractive and simple photo gallery for your website or blog, please use below code and you can easily modify the code. For any technical issue you can feel free contact to us.

<!DOCTYPE html>
<html lang="en">
<head>
<title> CSS GALLERY </title>
<style type="text/css">
.div_img{ width:250px; float:left; border:3px solid #990000; margin:10px;}
.div_img:hover { opacity:0.5; border:3px solid #0099FF}
.div_img p{ padding:5px; text-align:center;}
</style>
</head>

<body>
<div class="div_img">
<img src="http://codingtag.com/wp-content/uploads/2016/07/onTime-Infotech-FB.jpg" width="250" height="200">
<p> Image Title 1 </p>
</div>
<div class="div_img">
<img src="http://codingtag.com/wp-content/uploads/2016/07/onTime-Infotech-FB.jpg" width="250" height="200">
<p> Image Title 2 </p>
</div>
<div class="div_img">
<img src="http://codingtag.com/wp-content/uploads/2016/07/onTime-Infotech-FB.jpg" width="250" height="200">
<p> Image Title 3 </p>
</div>
<div class="div_img">
<img src="http://codingtag.com/wp-content/uploads/2016/07/onTime-Infotech-FB.jpg" width="250" height="200">
<p> Image Title 4 </p>
</div>
</body>
</html>

RESULT:




Leave a Reply

avatar
  Subscribe  
Notify of