123
шаблон занятые
Страница: 1
Сообщений 1 страница 2 из 2
Поделиться12025-06-25 19:38:34
-
- Администратор
- имя фамилия 00 Lorem ipsum odor amet, consectetuer adipiscing elit. Rhoncus eu mi rhoncus iaculis lacinia. Molestie litora scelerisque et phasellus lobortis venenatis nulla vestibulum.
текст для плашки
- Сообщений: 22
- Уважение: +1
- валюта: 12312
- посты: 123
Поделиться22025-06-25 19:40:36
-
- Администратор
- имя фамилия 00 Lorem ipsum odor amet, consectetuer adipiscing elit. Rhoncus eu mi rhoncus iaculis lacinia. Molestie litora scelerisque et phasellus lobortis venenatis nulla vestibulum.
текст для плашки
- Сообщений: 22
- Уважение: +1
- валюта: 12312
- посты: 123
[html]
<style>
/* список занятых */
charlist {
width: 1015px;
height: 830px;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 55px 12px;
padding: 60px 8px 0;
box-sizing: border-box;
position: relative;
background: rgba(237, 237, 237, 1);
margin-top: 65px !important;
margin-left: -30px !important;
}
charlist::before {
content: '';
position: absolute;
left: 0px;
top: -78px;
width: 180px;
height: 192px;
background: url(https://forumstatic.ru/files/001c/80/b1/72687.png) no-repeat center / 100%;
background-size: 100%;
mix-blend-mode: darken;
}
charlist::after {
content: '';
position: absolute;
right: 0px;
top: -72px;
width: 192px;
height: 146px;
background: url(https://forumstatic.ru/files/001c/80/b1/81424.png);
background-size: 100%;
}
charlist div:nth-child(even)::before {
content: attr(data-title);
position: absolute;
top: -35px;
left: 1px;
width: 998px;
height: 24px;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
box-sizing: border-box;
z-index: 10;
font-weight: 700;
padding: 5px 18px 6px;
font-size: 24px;
text-transform: lowercase;
letter-spacing: 2px;
}
charlist div:nth-of-type(2)::before {
left: auto;
right: 6px;
}
charlist div:nth-of-type(2)::after {
left: auto;
right: 25px;
}
charlist div p {
position: relative;
width: 461px;
height: 169px;
overflow: auto !important;
}
charlist div {
display: block;
width: 493px;
height: 232px;
padding: 5px 25px 13px;
position: relative;
border-radius: 4px;
box-sizing: border-box;
background: rgba(230, 230, 230, 1);
border: 1px solid rgba(0, 0, 0, 1);
z-index: 1;
}
visages {
display: block;
position: absolute;
font-size: var(--fs12);
left: 260px;
top: -70px;
}
visages span {
font-weight: 700;
font-size: 48px;
display: block;
color: rgba(0, 0, 0, 0.2);
}
charlist div span {
display: block;
width: 100%;
text-align: center;
border-bottom: 1px dashed rgba(0, 0, 0, 0.4);
font-weight: 700;
font-size: 14px;
padding-bottom: 5px;
margin-bottom: 8px !important;
}
</style>
<charlist data-title='list of characters'>
<visages>
<span>ВНЕШНОСТИ</span>
[sn] — заняты имя и фамилия, [s] — занята фамилия, [n] — занято имя
</visages>
<!----- abcdefghi -------------------------->
<div data-title='abcdefghi'>
<!----- boys -------------------------->
<span> boys </span>
<p>
<a href='#'>group; solo; actor</a> — <a href='#'>surname name</a><br>
group; solo; actor — <a href='#'>surname name</a><br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
</p></div>
<!----- girls -------------------------->
<div>
<span> girls </span>
<p>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
</p>
</div>
<!----- jklmnopqr -------------------------->
<div data-title='jklmnopqr'>
<!----- boys -------------------------->
<span> boys </span>
<p>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
</p></div>
<!----- girls -------------------------->
<div><span> girls </span><p>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
</p>
</div>
<!----- stuvwxyz -------------------------->
<div data-title='stuvwxyz'>
<!----- boys -------------------------->
<span> boys </span>
<p>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
</p></div>
<!----- girls -------------------------->
<div><span> girls </span><p>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
group; solo; actor — surname name<br>
</p>
</div>
</charlist>[/html][hideprofile]
Страница: 1
