шаблоны хтмл
Страница: 1
Сообщений 1 страница 7 из 7
Поделиться12025-10-13 12:06:08
- 1
агент, 33Шц. преображения, наставник
заведующий отделом тестирования
- Личное дело
- Сообщений: 69
- Уважение: +1
- Валюта: 1000
- Последний визит:
2026-01-21 00:59:02
Поделиться22025-10-15 00:35:02
- 1
- агент, 33Ш
ц. преображения, наставник
заведующий отделом тестирования
- Личное дело
- Сообщений: 69
- Уважение: +1
- Валюта: 1000
- Последний визит:
2026-01-21 00:59:02
https://wecode.jcink.net/index.php?showtopic=5434[html]<div class="default_body">
<div class="default_header"> М А Т Ч А С Т Ь</div>
<div class="new_body">
<div class="new_header">Омегаверс</div><br>
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
when an <b>unknown</b> printer took a galley of type and scrambled it to make a type
specimen book. <br><br>It has survived not only five centuries,
but also the leap into electronic typesetting, remaining essentially <b>unchanged</b>.
It was popularised in the 1960s with the release of Letraset sheets containing
Lorem Ipsum passages, and more recently with desktop publishing software like
Aldus PageMaker including versions of Lorem Ipsum.<br><br>
<div class="new_header">Гон/течка</div><br>
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
when an unknown printer took a galley of type and scrambled it to make a type
specimen book. <br><br>It has survived not only five centuries.<br><br>
<div class="new_header">Беременность</div><br>
Ла-ла-ла. Хуй.
</div>
<style>
* {box-sizing:border-box;}
.default_body {width:680px;
;margin:10px auto;
outline:1px solid #ccc;
border:20px solid #eee;
-webkit-box-shadow:inset 0px 0px 0px 1px #ccc;
-moz-box-shadow:inset 0px 0px 0px 1px #ccc;
box-shadow:inset 0px 0px 0px 1px #ccc;
background-image:url('https://i.imgbox.com/v0FYMKBD.png');}
.default_header {background-color:#c5c2bc;border:1px solid #ccc;
font-size:16pt;font-family:'montserrat',sans-serif;
font-weight:800;text-transform:uppercase;
color:#a1a8aa;display:inline-block;
height:80px;line-height:80px;
padding:0px 30px;width:640px;
box-sizing:border-box;}
.new_header {background-color:#d7dadb;
border:1px solid #ccc;
font-size:16pt;
font-family:'montserrat',sans-serif;
font-weight:800;text-transform:uppercase;
color:#a1a8aa;display:inline-block;
height:60px;line-height:60px;padding:0px 30px;
width:340px;box-sizing:border-box;margin-bottom:8px;}
.new_body {padding:20px 30px;
font-size:8pt;font-family:'open sans',sans-serif;
color:#999;margin:20px;border:1px solid #ccc;
background-color:#fdd9b5;text-align:justify;}
.new_body b {color:#aaa;
text-transform:lowercase;
font-weight:700;font-size:9pt;
display:inline-block;}
.default_footer {background-color:#fdd9b5;
border:1px solid #ccc;height:40px;width:440px;}
#credits {
text-align:right;
width:377px;
margin:auto;
}
#credits a {
text-decoration:none;
font:bold 6pt 'montserrat',sans-serif;
color:#aaa;
}
</style>
[/html]
Поделиться32025-10-15 00:46:48
- 1
- агент, 33Ш
ц. преображения, наставник
заведующий отделом тестирования
- Личное дело
- Сообщений: 69
- Уважение: +1
- Валюта: 1000
- Последний визит:
2026-01-21 00:59:02
[html]<link href="https://fonts.googleapis.com/css?family=Playfair+Display:400,400i,600,700,800,900|Roboto|Raleway|Sawarabi+Gothic" rel="stylesheet">
<style>
#faceclaims {
width: 500px;
background: #fff;
height: auto;
position: relative;
margin: 30px auto;
border: 1px solid #ccc;
outline: 1px solid #bb9656;
outline-offset: 10px;
font-family: roboto;
color: #191919;
line-height: 170%;
font-size: 11px;
margin-bottom: 10px;
}
#faceclaims maintitle {
position: relative;
display: block;
height: 60px;
border-bottom: 1px solid #bb9656;
overflow: hidden;
font-family: playfair display;
font-weight: 800;
text-align: center;
color: #bababa;
text-transform: uppercase;
line-height: 230%;
font-size: 40px;
}
#faceclaims text {
font-family: roboto;
padding: 30px;
display: block;
color: #191919;
text-align: justify;
font-size: 11px;
line-height: 150%;
}
#faceclaims subtitle {
position: relative;
display: block;
height: 20px;
border-bottom: 1px solid #ccc;
overflow: hidden;
font-family: playfair display;
font-weight: 800;
text-align: left;
color: #bababa;
text-transform: uppercase;
line-height: 130%;
font-size: 20px;
}
#faceclaims descript {
display: block;
color: #ddd!important;
font-size: 9px!important;
}
#faceclaims nameblock {
width: 300px;
height: 20px;
position: relative;
display: flex;
margin: 2px auto;
justify-content: space-between;
color: #191919;
line-height: 200%;
font-size: 11px;
text-transform: uppercase;
border-bottom: 1px solid #eee;
}
#faceclaims faceclaim {
display: block;
}
#faceclaims a {
color: #bb9656;
display: block;
text-decoration: none;
}
</style>
<div id="faceclaims">
<maintitle>Face Claims</maintitle>
<text>Face claims are limited to signed actors, musicians, and models on TV. No internet personalities or youtube stars will be permitted.</text>
<subtitle>A-F</subtitle>
<text>
<nameblock><descript>Face Claim</descript> <descript>Character</descript></nameblock>
<nameblock><faceclaim>Last, First</faceclaim><a href="">Character Name</a></nameblock>
</text>
<subtitle>G-M</subtitle>
<text>
<nameblock><descript>Face Claim</descript> <descript>Character</descript></nameblock>
<nameblock><faceclaim>Last, First</faceclaim><a href="">Character Name</a></nameblock>
<nameblock><faceclaim>Last, First</faceclaim><a href="">Character Name</a></nameblock>
<nameblock><faceclaim>Last, First</faceclaim><a href="">Character Name</a></nameblock>
<nameblock><faceclaim>Last, First</faceclaim><a href="">Character Name</a></nameblock>
</text>
<subtitle>N-Z</subtitle>
<text>
<nameblock><descript>Face Claim</descript> <descript>Character</descript></nameblock>
<nameblock><faceclaim>Last, First</faceclaim><a href="">Character Name</a></nameblock>
<nameblock><faceclaim>Last, First</faceclaim><a href="">Character Name</a></nameblock>
<nameblock><faceclaim>Last, First</faceclaim><a href="">Character Name</a></nameblock>
</text>
</div>
<center><a href="http://wecode.jcink.net/index.php?showuser=4933" style="color:#ccc;font-size:7px;letter-spacing:5px;">MONTY</a></center>
[/html]
Поделиться42025-10-15 00:59:29
- 1
- агент, 33Ш
ц. преображения, наставник
заведующий отделом тестирования
- Личное дело
- Сообщений: 69
- Уважение: +1
- Валюта: 1000
- Последний визит:
2026-01-21 00:59:02
[html]<link href="https://fonts.googleapis.com/css?family=Kumar+One+Outline" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">
<style>
#ellis {height: 500px; width: 500px; background: #000; margin: auto; position: relative; overflow: hidden}
#ellis .mainbit {height: 500px; width: 380px; position: absolute; overflow: hidden}
#ellis .mainbit img {height: 100%; width: 100%; object-fit: cover; filter: grayscale(100%); -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); position: absolute}
#ellis .mainbit scr {height: 100%; width:100%; background: #33804A; mix-blend-mode:multiply; position: absolute}
#ellis .firstlast {text-transform: uppercase; position: absolute; color: #eee; width: 100%; justify-content: flex-start; flex-direction: column; display: flex; box-sizing: border-box; padding-right: 50px; top: 270px; line-height: 1.55; background: none; align-items: flex-end; font-family: poppins; text-transform: uppercase; text-align: right; font-size: 11px; font-weight:600; letter-spacing: 1px; transition: 0.6s ease; right: 0}
#ellis .firstlast span {font-family: kumar one outline; font-size: 35px; text-align: left; font-weight: 400; letter-spacing: 0; line-height: 1.1}
#ellis li1 {height: 50px; width: 1px; background: #33804A; position: absolute; left: 410px}
#ellis input {display: none}
#ellis #trtog+label {height: 25px; line-height: 25px; position: absolute; width: 200px; background: none; font-family: poppins; text-transform: uppercase; font-weight: 700; letter-spacing: 2px; font-size: 10px; color: #eee; transform: rotate(90deg); top: 150px; left: 310px; cursor: crosshair}
#ellis #trtog+label span.closed {opacity: 1}
#ellis #trtog:checked+label span.closed {opacity: 0}
#ellis #trtog+label span.open {opacity: 0}
#ellis #trtog:checked+label span.open {opacity: 1}
#ellis #trtog+label span.closed, #ellis #trtog+label span.open {position: absolute}
#ellis #trtog:checked+label ~ .firstlast {right: -30px; opacity: 0}
#ellis .mainbit .tracker {width: 380px; height: 500px; background: #000; left: 380px; position: absolute; transition: 0.9s ease; box-sizing: border-box; color: #eee; border: 50px solid #000; overflow: auto}
#ellis .mainbit .tracker::-webkit-scrollbar {width: 0}
#ellis #trtog:checked+label ~ .mainbit .tracker {left: 0}
#ellis .mainbit .tracker .header {font-family: kumar one outline; text-transform: uppercase; color: #33804A; font-size: 20px; line-height: 1.3; margin: 10px 0;}
#ellis .mainbit .tracker .linkbit {display: flex; flex-direction: column; justify-content: center; font-family: poppins; text-transform: uppercase; font-weight: 700; font-size: 10px; letter-spacing: 1px; align-items: flex-end; line-height: 1.7; margin-bottom: 5px}
#ellis .mainbit .tracker .linkbit a {color: #eee; font-family: kumar one outline; text-decoration: none; font-size: 13px; letter-spacing: 0px}
</style>
<div id="ellis">
<li1></li1>
<input type="checkbox" id="trtog" name="ellislabel">
<label for="trtog">
<span class="closed">click to view tracker</span>
<span class="open">return home</span>
</label>
<div class="mainbit">
<img src="https://forumstatic.ru/files/001c/87/98/85583.jpg">
<scr></scr>
<div class="tracker">
<div class="header">active threads</div>
<div class="linkbit"><a href="link">title here</a> with first last</div>
<div class="linkbit"><a href="link">title here</a> with first last</div>
<div class="header">dead threads</div>
<div class="linkbit"><a href="link">title here</a> with first last</div>
<div class="linkbit"><a href="link">title here</a> with first last</div>
<div class="header">complete threads</div>
<div class="linkbit"><a href="link">title here</a> with first last</div>
<div class="linkbit"><a href="link">title here</a> with first last</div>
</div>
</div>
<div class="firstlast"><span>first<br>last</span>AGE<br>OCCUPATION<br>MEMBERGROUP<br>fc: here</div>
</div>
<a href="http://wecode.jcink.net/index.php?showuser=4918"><div style="width: 500px; margin: 10px auto; text-align: right; font-size: 8px; font-family: arial; text-transform: uppercase; color: #aaa;">liv's codes</div></a>
[/html]
Поделиться52025-10-15 01:20:47
- 1
- агент, 33Ш
ц. преображения, наставник
заведующий отделом тестирования
- Личное дело
- Сообщений: 69
- Уважение: +1
- Валюта: 1000
- Последний визит:
2026-01-21 00:59:02
[html]
<div class="episod">
<h4>очень красивое и длинное название игрового эпизода</h4>
<div class="episod_inner">
<div class="datavrema">
<div class="episod_faces">
<a href="ссылка на профиль"><img src="https://forumstatic.ru/files/001c/33/e8/36564.webp" title="имя персонажа"></a>
<a href="ссылка на профиль"><img src="https://forumstatic.ru/files/001c/33/e8/36564.webp" title="имя персонажа"></a>
<a href="ссылка на профиль"><img src="https://forumstatic.ru/files/001c/33/e8/36564.webp" title="имя персонажа"></a>
</div>
<span>дата и время ▪ место событий</span>
</div>
<div class="episod_opis">
<p> описание эпизода </p>
</div>
</div>
</div>
<style>
:root {
--border: 1px solid #d2d2d2;
--background1: #f6f6f6;
--background2: #ffffff;
--text: #969696;
}
.episod {
position: relative;
margin: 40px auto 0 !important;
box-sizing: border-box;
border: var(--border);
background: var(--background1);
width: 624px;
height: 324px;
padding: 10px;
}
.episod_inner {
border: var(--border);
box-sizing: border-box;
background: var(--background2);
width: 100%;
height: 100%;
}
.episod h4 {
border: var(--border);
background: var(--background1);
position: absolute;
width: 544px;
transform: translate(-50%, -100%);
margin-top: 0px;
left: 50%;
text-align: center;
border-bottom: none;
font-size: 16px!important;
padding: 4px;
font-weight: normal;
font-family: "AppetitePro"!important;
color: var(--text);
line-height: 1.2;
text-shadow: 1px 2px 1px #ffffff;
}
.datavrema {
border-block: var(--border);
background: var(--background1);
position: relative;
width: 100%;
height: 64px;
margin-top: 68px!important;
text-align: center;
box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-end;
padding-bottom: 5px;
gap: 20px;
}
.datavrema span {
font-size: 11px;
font-family: "Verdana";
color: var(--text);
line-height: 1.2;
}
.episod_faces {
display: flex;
gap: 40px;
align-items: flex-end;
}
.episod_faces a {
display: block;
height: 60px;
width: 60px;
}
.episod_faces a img {
height: 100%;
width: 100%;
object-fit: cover;
object-position: top center;
filter: grayscale(100%);
border: var(--border);
}
.episod_opis {
margin: 30px 30px!important;
font-size: 11px;
font-family: "Verdana";
color: var(--text);
line-height: 1.2;
height: 120px;
overflow: auto;
text-align: justify;
scrollbar-width: thin;
padding: 0 10px 0 10px;
}
</style>[/html]
Поделиться62025-10-15 01:23:38
- 1
- агент, 33Ш
ц. преображения, наставник
заведующий отделом тестирования
- Личное дело
- Сообщений: 69
- Уважение: +1
- Валюта: 1000
- Последний визит:
2026-01-21 00:59:02
[html]<link rel="stylesheet" href="https://kit-pro.fontawesome.com/releases/v6.1.2/css/pro.min.css">
<div class="guest-template-container">
<div class="guest-header">
<h1>forum name</h1>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.</p>
</div>
<div class="guest-section-title"><i class="fa-solid fa-user"></i> БРОНИ</div>
<div class="guest-column-container">
<div class="guest-column">
<h3><i class=""></i> Внешности</h3>
<div class="guest-item-container">
<p class="guest-item">имя фамилия - <a href="#">имя фамилия</a> <i class="fas fa-heart"></i></p>
<p class="guest-item">имя фамилия - <a href="#">имя фамилия</a> <i class="fas fa-heart"></i></p>
<p class="guest-item">имя фамилия - <a href="#">имя фамилия</a> <i class="fas fa-heart"></i></p>
</div>
</div>
<div class="guest-column">
<h3><i class=""></i> Роли</h3>
<div class="guest-item-container">
<p class="guest-item">имя фамилия - <a href="#">имя фамилия</a> <i class="fas fa-heart"></i></p>
<p class="guest-item">имя фамилия - <a href="#">имя фамилия</a> <i class="fas fa-heart"></i></p>
<p class="guest-item">имя фамилия - <a href="#">имя фамилия</a> <i class="fas fa-heart"></i></p>
</div>
</div>
</div>
<div class="guest-footer">
место для каких-то навигационных ссылок / списка администрации / чего-то другого
</div>
</div>[/html]
Поделиться72025-11-04 06:11:56
- 1
- агент, 33Ш
ц. преображения, наставник
заведующий отделом тестирования
- Личное дело
- Сообщений: 69
- Уважение: +1
- Валюта: 1000
- Последний визит:
2026-01-21 00:59:02
Пишем заголовок в формате "name surname // sex // XX y.o."
fandom // name
имя и фамилия на английском
имя и фамилия на русском // прозвища и клички
возраст и дата рождения: в игре 2021 год (калькулятор для гуманитариев);
организация: тора, хеби, нейтрал;
род деятельности: чем занимается персонаж в банде/организации и место работы и должность там (если имеется);
ориентация: чьи пипки больше предпочитает; (заполняется по желанию)
феромон
▶︎ название песни — исполнитель сюда можно сунуть песню от которой веет вайбом вашего персонажа
краткое описание вашего персонажа в свободной форме или любая другая информация, которую вы посчитаете нужным здесь указать
биография и характер персонажа. вы вольны излагать информацию в удобной для себя форме: хотите сплошным текстом, хотите пунктами. мы не ограничиваем в объёме описания, не заставляем писать определённое количество символов.
отдельным пунктом или нет стоит описать, как персонаж учился управлять своей способностью, сколько времени на это потратил, на каком уровне остановился.
если вам по той или иной причине не хочется пока раскрывать какую-то часть информации другим игрокам, вы смело можете спрятать её под хайд. там же вы можете прописать планы на дальнейшее развитие персонажа.
Что-то дополнительно, что не входит в общее описание.
Здесь же можно отметить и секретную/недоступную информацию, которую рядовой житель Балтимора знать не должен
Связь: ответ.
Желание участвовать в сюжете: да/нет.
Страница: 1