123
шаблон полароиды
Страница: 1
Сообщений 1 страница 2 из 2
Поделиться12026-09-03 23:24:00
- Администратор
ирма кернс, 118 ведьма ┏━━━━•❃°•°❀°•°❃•━━━━┓
все дороги ведут к нашей встрече
всё моё найдёт меня точно
┗━━━━•❃°•°❀°•°❃•━━━━┛- Сообщений: 59
- Уважение: +1
- валюта: 123
- Посты: 123
первая строка текста
Поделиться2Вчера 00:02:20
- Администратор
ирма кернс, 118 ведьма ┏━━━━•❃°•°❀°•°❃•━━━━┓
все дороги ведут к нашей встрече
всё моё найдёт меня точно
┗━━━━•❃°•°❀°•°❃•━━━━┛- Сообщений: 59
- Уважение: +1
- валюта: 123
- Посты: 123
первая строка текста
[html]
<style>
.photo-event {
position: relative;
width: 750px;
height: 700px;
margin: auto !important;
background-image: url(https://forumstatic.ru/files/001c/a5/43/62263.png);
box-sizing: border-box;
padding: 25px;
}
.photo-event * {
box-sizing: border-box;
}
.photo-event h5 {
color: #c0c0c0;
width: 100%;
text-align: center;
text-transform: lowercase;
font: 400 50px Playfair Display;
font-style: italic;
}
.photo-event desc {
display: block;
text-align: center;
color: #c0c0c0;
width: 100%;
}
.photo-event .photo-event-wrapper {
position: relative;
margin-top: 30px;
z-index: 5;
}
.photo-event .photo-event-wrapper > div::before {
content:'';
background-image: url(https://forumstatic.ru/files/001c/a5/43/83165.png);
width: 200px;
height: 244px;
position: absolute;
top: 0px;
left: 0px;
}
.photo-event .photo-event-wrapper > div {
width: 200px;
height: 244px;
position: absolute;
}
.photo-event .photo-event-wrapper > div img {
width: 180px;
height: 180px;
object-fit: cover;
}
.photo-event .photo-event-wrapper > div img {
position: relative;
z-index: -2;
margin: 22px 10px;
}
.photo-event .photo-event-wrapper > div:nth-child(1) {
top: 20px;
left: 10px;
transform: rotate(-5deg);
}
.photo-event .photo-event-wrapper > div:nth-child(2) {
top: 0px;
left: 250px;
transform: rotate(3deg);
}
.photo-event .photo-event-wrapper > div:nth-child(3) {
top: 30px;
left: 480px;
transform: rotate(8deg);
}
.photo-event .photo-event-wrapper > div:nth-child(4) {
top: 270px;
left: 140px;
transform: rotate(-5deg);
}
.photo-event .photo-event-wrapper > div:nth-child(5) {
top: 285px;
left: 380px;
transform: rotate(7deg);
}
</style>
<section class='photo-event'>
<h5>ТЕКСТ НАЗВАНИЯ</h5>
<desc>краткое описание не больше двух-трёх строк</desc>
<div class='photo-event-wrapper'>
<div><img src='https://i.pinimg.com/1200x/f8/82/6a/f8826a066882e7114ac8238f5f7ffd5d.jpg'></div>
<div><img src='https://i.pinimg.com/1200x/f8/82/6a/f8826a066882e7114ac8238f5f7ffd5d.jpg'></div>
<div><img src='https://i.pinimg.com/1200x/f8/82/6a/f8826a066882e7114ac8238f5f7ffd5d.jpg'></div>
<div><img src='https://i.pinimg.com/1200x/f8/82/6a/f8826a066882e7114ac8238f5f7ffd5d.jpg'></div>
<div><img src='https://i.pinimg.com/1200x/f8/82/6a/f8826a066882e7114ac8238f5f7ffd5d.jpg'></div>
</div></section>
[/html]
Страница: 1