CSS

Polaroid Image Border

img.polaroid {
background:#000; /*Смените его на фоновое изображение или удалите*/
border:solid #fff;
border-width:6px 6px 20px 6px;
box-shadow:1px 1px 5px #333; /* Стандартное размытие на 5px. Для пущей глубины увеличьте его */
-webkit-box-shadow:1px 1px 5px #333;
-moz-box-shadow:1px 1px 5px #333;
height:200px; /* Установите на высоту своего изображения или нужного div’а*/
width:200px; /* Установите на ширину своего изображения или нужного div’а */
}

Применение этого простого фрагмента позволит вам применить к своим изображениям классы .polaroid. Так получается эффект старинной фотографии с широкой белой рамкой и легкими тенями блока. Вам понадобится изменить значения ширины/высоты, чтобы те соответствовали размерам вашего изображения и разметке вебсайта.
Теги:
Polaroid Image, Border
Добавлено: 12 Апреля 2018 06:57:34 Добавил: Андрей Ковальчук Нравится 0
Добавить
Комментарии:
Нету комментариев для вывода...