[html]<!-- Стиль для вкладок в постах (done by Kolobdur) -->
<style>
.tablet {
background-image: url(https://forumupload.ru/uploads/001b/ce/b4/4/104993.png);
width: 700px;
height: 920px;
margin-left: 20px;
}
/* Строка имени */
.stim {
width: 578px;
border: 1px;
border-color: #000;
background-color: #959D9F;
font-family: Oswald;
text-align: center;
position: absolute;
margin-top: 40px;
margin-left: 55px;
text-transform: uppercase;
}
.tabbed > input {
display: none;
}
.tabbed > label {
width: 100px;
margin-top: 110px;
margin-left: 43px;
margin-bottom: -90px;
display: block;
padding-top: 10px;
padding-left: 5px;
padding-right: 5px;
font-family: Oswald;
text-size: 20px;
text-transform: uppercase;
}
.tabbed > label:not(.nav-top-start):not(.nav-top-end):not(.nav-bottom-start):not(.nav-bottom-end) {cursor: pointer;z-index: 1;}
/* Оформление */
/* Оформление неактивного переключателя */
.tabbed > label:not(.nav-top-start):not(.nav-top-end):not(.nav-bottom-start):not(.nav-bottom-end) {
background: transparent;
color: #191970;
height: 30px;
}
/* Оформление активного переключателя и при наведении */
.tabbed > label:not(.nav-top-start):not(.nav-top-end):not(.nav-bottom-start):not(.nav-bottom-end):hover,
.tabbed > input:checked + label {
background: #A02223 !important;
color: azure !important;
}
/* Оформление поля с контентом */
.tabs-body {
background: transparent;
color: #000;
}
/* Даем имена переключателям и полю с контентом */
/* Имя поля с контентом */
.tabs-body {grid-area: tabs-body;}
/* Имена переключателей слева */
#nav-left-1 {grid-area: nav-left-1;}
#nav-left-2 {grid-area: nav-left-2;}
#nav-left-3 {grid-area: nav-left-3;}
#nav-left-4 {grid-area: nav-left-4;}
#nav-left-5 {grid-area: nav-left-5;}
#nav-left-6 {grid-area: nav-left-6;}
#nav-left-7 {grid-area: nav-left-7;}
#nav-left-8 {grid-area: nav-left-8;}
#nav-left-9 {grid-area: nav-left-9;}
#nav-left-10 {grid-area: nav-left-10;}
.tabs-body {
width: auto;
position: relative;
}
.tabs-body > div {
position: absolute;
top: 0;
left: 0;
line-height: 1.4em;
opacity: 0;
width: auto;
height: 726px;
padding: 10px;
z-index: 0;
margin-top: 110px;
margin-right: 55px;
text-align: justify;
overflow: auto;
}
/* Переключатели */
/* Слева */
#nav-left-1:checked ~ .tabs-body > .body-left-1,
#nav-left-2:checked ~ .tabs-body > .body-left-2,
#nav-left-3:checked ~ .tabs-body > .body-left-3,
#nav-left-4:checked ~ .tabs-body > .body-left-4,
#nav-left-5:checked ~ .tabs-body > .body-left-5,
#nav-left-6:checked ~ .tabs-body > .body-left-6,
#nav-left-7:checked ~ .tabs-body > .body-left-7,
#nav-left-8:checked ~ .tabs-body > .body-left-8,
#nav-left-9:checked ~ .tabs-body > .body-left-9,
#nav-left-10:checked ~ .tabs-body > .body-left-10,
/* Справа */
#nav-right-1:checked ~ .tabs-body > .body-right-1,
#nav-right-2:checked ~ .tabs-body > .body-right-2,
#nav-right-3:checked ~ .tabs-body > .body-right-3,
#nav-right-4:checked ~ .tabs-body > .body-right-4,
#nav-right-5:checked ~ .tabs-body > .body-right-5,
#nav-right-6:checked ~ .tabs-body > .body-right-6,
#nav-right-7:checked ~ .tabs-body > .body-right-7,
#nav-right-8:checked ~ .tabs-body > .body-right-8,
#nav-right-9:checked ~ .tabs-body > .body-right-9,
#nav-right-10:checked ~ .tabs-body > .body-right-10 {
transform: translateY(0px);
transform: translateX(0%);
opacity: 1;
z-index: 1;
}
input[id^=nav] ~ .tabs-body > div[class^=body] {
}
</style>
<!-- В пост. Только слева. (done by Kolobdur) -->
<style>
.tabbed {
display: grid;
grid-template: /* навигация слева и поле */
"nav-left-1 tabs-body tabs-body tabs-body tabs-body" 1fr
"nav-left-2 tabs-body tabs-body tabs-body tabs-body" 1fr
"nav-left-3 tabs-body tabs-body tabs-body tabs-body" 1fr
"nav-left-4 tabs-body tabs-body tabs-body tabs-body" 1fr
"nav-left-5 tabs-body tabs-body tabs-body tabs-body" 1fr
"nav-left-6 tabs-body tabs-body tabs-body tabs-body" 1fr
/* Коллонки */
/ 1fr 1fr 1fr 1fr 1fr;
width: 100%;
}
</style>
<div class="tablet">
<div class="stim"><td> Юн Бакудан <br> Уровень доступа: F </div>
<div class="tabbed">
<!-- Навигация слева -->
<!-- Слева 1 -->
<input type="radio" name="tabs-body" id="nav-left-1" checked>
<label for="nav-left-1">Личные данные</label>
<!-- Слева 2 -->
<input type="radio" name="tabs-body" id="nav-left-2">
<label for="nav-left-2">Внешность</label>
<!-- Слева 3 -->
<input type="radio" name="tabs-body" id="nav-left-3">
<label for="nav-left-3">Способность 1</label>
<!-- Слева 4 -->
<input type="radio" name="tabs-body" id="nav-left-4">
<label for="nav-left-4">Способность 2</label>
<!-- Слева 5 -->
<input type="radio" name="tabs-body" id="nav-left-5">
<label for="nav-left-5">Характер</label>
<!-- Слева 6 -->
<input type="radio" name="tabs-body" id="nav-left-6">
<label for="nav-left-6">Биография</label>
<div class="tabs-body">
<!-- Контент вкладок слева -->
<div class="body-left-1">
<center><img src="https://forumupload.ru/uploads/001b/fb/3e/22/191690.png"></center>
Akali | League of legends<br>
Пол: женский<br>
Дата рождения: 20.08.2103<br>
Возраст: 20 <br>
Рост и вес: 175 / 55<br>
<br>
Семейное положение: вечная холостячка<br>
Должность/Статус: студентка, 3 курс, тактика.<br>
Ник в чате академии: badaboom~<br>
<br>
Отличительные признаки
<br>
Цвет глаз: светло-синий<br>
Цвет волос: темно-розовый с лиловым отливом<br>
Татуировки/Шрамы/Пирсинг/Пигментация: татуировка в области лопаток в виде восточного дракона (на всю длину, от левого до правого плеча), пирсинг в левом соске, несколько проколов в ушах, маленькие неоновые тату в виде линий, заметные лишь в ультрафиолете - на животе, руках и бедрах.
</div>
<div class="body-left-2"><br>
Юн стройная высокая девушка, метис с примесью азиатской крови. Из-за активного образа жизни имеет подкаченное телосложение, но в пределах нормы. У нее светло-синие глаза и необычного цвета волосы, которые бывали разных цветов в прошлом и наверняка еще будут в будущем. Волосы почти всегда собраны в хвост. Первые проколы в ушах сделаны лет в семь и далее по нарастающей. Татуировку дракона набила в 15 лет, выиграв деньги в карты у товарища. Любит иногда выпендриться и носить накладные ногти, но очень редко - куда уж бойцам ноготочки? Предпочитает спортивный, либо приближенный к нему стиль одежды. Без ума от кожаных вещей - курток, перчаток, штанов и т.д. Из обуви - исключительно кроссовки, либо что-то на толстом каблуке, эффектности ради.<br>
</div>
<div class="body-left-3">
► Взрыв<br><br>
Применение: активная, применяется в отношении предметов. Чтобы взорвать предмет, Юн должна хорошо его видеть.<br><br>
Ограничения: Достаточно указания рукой и концентрации взглядом, чтобы ускорить движение молекул и предмет взорвался. При этом, чем дальше от Юн предмет, тем больше времени требуется, чтобы его взорвать. И если стоящую поблизости условную чашку можно подорвать за секунду, то чтобы взорвать лавочку в парке, глядя на ту из окна второго этажа, потребуется время. Большие предметы по размеру взрывать сложнее и дольше маленьких, на это также требуется больше времени. Негативное действие способности: под действием сильных эмоций взрыв не контролируется. В состоянии гнева, злости, потрясения ближайший к Юн предмет взрывается, угрожая повредить ее саму и рядом стоящих союзников. Способность не работает на людях и других живых существах.Юн способна совершить до 10 взрывов за час, далее начнет ощущать сильную усталость и недомогание.<br><br>
Описание способности: благодаря ускоренному движению частиц предмет взрывается на мелкие части, зачастую не оставляя после себя следов.</div>
<div class="body-left-4">
► Сверхскорость<br><br>
Применение: активная, применяется на себя.<br><br>
Ограничения: Активируется усилием воли. Работает до 10 минут, при использовании выше этого времени ноги начинают буквально отказывать. Для следующего использования способности необходима передышка 1-2 часа. <br><br>
Описание способности: приобретается скорость, примерно равная скорости полета сокола-сапсана.
</div>
<div class="body-left-5">
Успеваемость: твердая троечница, но не потому что тупит а потому что не видит смысла напрягаться, пусть и знает что может вытянуться на “отлично”.<br>
<br>
Умная, бойкая и знающая себе цену. Завистники в спину прошепчут “Злая сука”, а Юн и не против. Она-то знает, что вовсе не злая. Просто умеет давать отпор намного жестче, чем многие могут ожидать.
<br><br>
У Юн железный кулак и металлический внутренний стержень: она может постоять не только за себя, но и за других. При этом, если человек хлюпик и много ноет, сама же ему и вмажет. Но из благих целей - дабы привести в чувства. А вообще ее такие только раздражают, ведь кто поборется за тебя, кроме тебя самого?
<br><br>
Очень азартна и падка на разного рода авантюры. Множество раз подвергала свою жизнь опасности и кажется, что адреналина ей всегда будет мало.
Ее бесят излишний контроль и порядок в стенах Академии, как и то, что кто-то пытается управлять ее жизнью. Мечтает вырваться из-под этой вынужденной опеки и самостоятельно распоряжаться своей жизнью.<br><br>
Ее довольно легко вывести из себя, но Юн над этим работает. Даже стала учиться медитациям ради благого дела.<br>
Нравится вкусная выпивка, но норму свою твердо знает. Завсегдатай и возможный спонсор алко-клуба.<br>
Любит броскую одежду, дорогие тачки и котят. Котята милые.<br>
Прямо как Ильва, когда не бесит.<br>
</div>
<div class="body-left-6">
Юн 7. У нее много младших братишек и сестер, казалось бы, где здесь логика? Сиди дома, помогай матушке, тем паче, что та никогда не говорила, что братишки и сестрички Юн не вполне родные. Юн - полукровка, но ей абсолютно плевать. Плевать уже тогда настолько, что спонтанным взрывом она едва не размозжила череп соседской псине, что посмела напасть на нее.
<br><br>
Ей 12 и ничего особо не меняется. Юн убегала из дома. Часто. Регулярно. Нарушала правила, установленные главой семьи, потому что желала вырваться из надоевшего ей мира, потому что не могла выносить постоянные визги и ругань, учитывая, собственный далеко не сахарный характер. Ей ведь тоже доставалось, а она в отместку портила вещи и ночевала у едва знакомых парней и девушек, считая, что там лучше, чем дома. Чуинцин огромный город, там есть, чем заняться.
<br><br>
К 16 Юн уже несколько раз едва не попадалась на преступлениях со своими товарищами, но быстрые ноги и ловкие руки уносили из беды. Ходить по лезвию ножа девушке нравилось. Еще нравилось заниматься единоборствами и мечтать о карьере великой звезды айкидо.
<br><br>
К сожалению, мечты и стремления пожить всласть для себя жестко оборвались с приходом людей из интерната.из-за того, что Юн постоянно кочевала туда-сюда по городу, ее не сразу удалось достать. Но если те люди думали, что Юн просто так будет сидеть под опекой, то плевать на это Юн хотела. Она предприняла несколько попыток сбежать из интерната, каждый раз совершенствуя свой план и рискуя не только своей задницей, но и теми, кого подговорила под это дело. У Юн поразительный талант собирать вокруг себя ярких потрясающих людей, но она до сих пор не поняла, как в эту компанию затесалась милашка Ильва. Случайно, наверное. Просто Юн не очень понравилось наблюдать одно жалкое зрелище в стенах рядом с собой и она решила вступиться за девчонку, отбивая ту от стайки гиен и наживая себе врагов. Милая блондиночка стала ходить за ней хвостом, чего Юн до сих пор понять не может.
<br><br>
Стены школы не избавили Юн от прилипшего кленового листочка, но что уж поделать. Это даже мило. Только об этом знать никто не должен, конечно. Где Юн и где мило? Пф, бред.<br><br>
Секретная информация: привязанность к Ильве, крупная кража в прошлом, из-за которой один товарищ угодил в тюрьму, и абсолютное неумение носить платья. А еще Юн один раз мотоцикл угнала.
</div>
</div>
</div>
</div>
[/html]
Отредактировано Yun Bakudan (2023-10-11 22:32:41)
- Подпись автора
