|
CSS Урок 25 Галерея Изображений
CSS можно использовать для создания галереи изображений.
Добавьте здесь описание картинки
Добавьте здесь описание картинки
Добавьте здесь описание картинки
Добавьте здесь описание картинки
Галерея Изображений
Следующая галерея изображений создана с помощью CSS:
Пример<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="css/klematis_big.htm"><img src="images/klematis_small.jpg" alt="Klematis" width="110" height="90" /></a>
</div>
<div class="img">
<a target="_blank" href="css/klematis2_big.htm"><img src="images/klematis2_small.jpg" alt="Klematis" width="110" height="90" /></a>
</div>
<div class="img">
<a target="_blank" href="css/klematis3_big.htm"><img src="images/klematis3_small.jpg" alt="Klematis" width="110" height="90" /></a>
</div>
<div class="img">
<a target="_blank" href="css/klematis4_big.htm"><img src="images/klematis4_small.jpg" alt="Klematis" width="110" height="90" /></a>
</div>
</body>
</html>
|
Попробуйте сами »
Щелкните на кнопке "Попробуйте сами" чтобы увидеть как это работает |
|
