CSS Gallery

0 3771

To create an attractive and simple photo gallery for your website or blog, kindly use the below code and you can easily modify the code.

Code:

<!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="Put Here Image Path" width="250" height="200">
<p> Image Description 1 </p>
</div>
<div class="div_img">
<img src="Put Here Image Path" width="250" height="200">
<p> Image Description 2 </p>
</div>
<div class="div_img">
<img src="Put Here Image Path" width="250" height="200">
<p> Image Description 3 </p>
</div>
<div class="div_img">
<img src="Put Here Image Path" width="250" height="200">
<p> Image Description 4 </p>
</div>
</body>
</html>