Фотогалерея CSS // Вебшкола онлайн

 back-4581990 next-3591734

audi-big-7966821

Добавьте описание изображения

bentley-big-2203862

Добавьте описание изображения

bmw-big-8290681

Добавьте описание изображения

nissan-big-2503996

Добавьте описание изображения

Фотогалерея создана с помощью 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; }

Cars Добавьте описание изображения Cars Добавьте описание изображения Cars Добавьте описание изображения Cars Добавьте описание изображения

Посмотреть

Отличие галереи, приведенной на этой странице от галереи в примерах в том, что в этой галерее большие изображения выделены светло-зеленой рамкой. Впрочем, если вы внимательно изучали все до этого места, то вам будет просто самим добавить рамку того цвета, который вам нравится.

Что еще можно было бы сделать? Сделать ссылками не только изображения, но и подписи к ним. На страницах с большими изображениями можно было бы прописать обратные ссылки не только тексту «В галерею», но и самим изображениям. А можно было бы изображениям прописать ссылки на следующее большое изображение, а последнему изображению ссылку на возврат к превьюшкам. Так что у вас есть простор для фантазии.

 back-4581990 next-3591734