Эффект изображения с тенью

Изображения и картинки на сайте оживляют его, делают сайт более динамичным и интересным.

Предлагаю Вашему вниманию один из самых простых вариантов оформить изображения в статье — это изображения, которые отбрасывают тень. Выглядит это так:

Изображение с тенью

Изображения с тенью для сайтов uCoz и сайтов с использованием lightbox

Чтобы сделать такой эффект для изображений на страницах сайта uCoz нужно поместить системный код изображения $IMAGE…$ внутри тегов

и добавить к этим тегам CSS стили.

HTML
HTML в этом случае будет выглядеть так:

Если у Вас другой не в системе uCoz, но вы используете lightbox и ваше изображение помещено внутри тегов <a> </a>, тогда этот вариант также вам подходит. Только вместо $IMAGE…$ должен размещаться весь вариант html кода изображения. Например

CSS
Панель управления — Дизайн — Управление дизайном (CSS стили)
В самый конец всех стилей нужно вставить следующие:

где width: 450px — это ширина изображения, и ее вы можете менять по своему усмотрению.

Эффект изображения с тенью для тега <img>

Если Ваш сайт создан не в системе uCoz или Вы просто хотите добавить тень к изображению, которое вставляется с помощью тега тогда и CSS стили и HTML немного отличаются.

HTML

CSS


Подпишитесь на RSS канал - если Вы хотите первыми узнавать о новых статьях на сайте!!!

Статьи по теме:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *