Шаблон анкеты

Важные пояснения:
● Черты характера выбираем здесь. Подставляем нужную картинку и название для черт.

● Вместо картинки 475x260 ставим изображение своего персонажа.
● Специализация - ваше образование. Вы можете мастерски обращаться с бластером, быть богом стратегии, но волей судьбы работать на ферме или вышибалой в местом баре.
● ВНИМАНИЕ! На момент начала игры вы можете взять всего 4 черты характера. Дополнительные черты игроки могут получить в процессе игры.

● У <+!--HTML--> и [+code]/[+/code] в коде убираем плюсики.
● Анкета публикуется в разделе "База данных".
● Анкета, отклоненная администрацией, отправляется в архив до редактирования участником.

Код:

<!--HTML-->
<style>
.relas1{
  background:#161d2b;
  width:475px;
  height:auto;
  padding:7px;
  margin:0 auto;
  position:relative;
  line-height:normal;
}
.relas1 .dec span{
  width:15px;
  height:15px;
  background:#8094b3;
  display:block;
  margin-bottom:3px;
}
.relas1 .dec{
  position:absolute;
}
.relas1 .dec.izq{
  top:0px;
  left:-20px;
}
.relas1 .dec.dech{
  bottom:-5px;
  right:-20px;
}
.relas1 .dec.izq span:nth-of-type(1), .relas1 .dec.dech span:nth-of-type(3){
  background:#161d2b;
}
.relas1 .dec span:nth-of-type(2){
  background:#4f6d9c;
}
.relas1 .imagens{
  width:475px;
  position:relative;
  height:260px;
  overflow:hidden;
}
.relas1 .caja{
  background: url(http://se.uploads.ru/Vlsay.png);
  width:194px;
  height:223px;
  position:absolute;
  top:-235px;
  left:15px;
  font:14px Jura;
   padding-left:11px;
     padding-top:1px;
  overflow-y:auto;
  transition:ease-in-out 1.2s;
}
.relas1 .imagens:hover .caja {
  top:14px;
}
.relas1 .datos{
  position:absolute;
  width:210px;
  right:15px;
  top:6px;
  height:220px;
}
.relas1 .datos span{
  display:block;
  background: url(http://se.uploads.ru/NZXCE.png);
  text-align:center;
  font:17px Jura;
  text-transform:uppercase;
  letter-spacing:2px;
  padding:9px 0;
  position:relative;
  transition:ease-in-out 1s;
  margin-bottom:4px;
  bottom:-255px;
}
.relas1 .imagens:hover .datos span{
  bottom:0px;
}
.relas1 .imagens:hover .datos span:nth-of-type(2){
transition-delay:0.4s;
}
.relas1 .imagens:hover .datos span:nth-of-type(3){
transition-delay:0.8s;
}
.relas1 .imagens:hover .datos span:nth-of-type(4){
transition-delay:1.2s;
}
.relas1 .imagens:hover .datos span:nth-of-type(5){
transition-delay:1.6s;
}
.relas1 .imagens:hover .datos span:nth-of-type(6){
transition-delay:2.0s;
}
.relas1 .relation{
  background:#ced6e3;
  margin:-2px 0;
  height:105px;
  border-width:0px 0;
  border-color:#161d2b transparent #1d2b43;
  border-style:solid;
  padding:5px;
}
.relas1 .txt{
  display:inline-block;
  width:475px;
height:105px;
  box-sizing:border-box;
  padding-right:1px;
  overflow-y:auto;
  ;vertical-align:top;
  font:13px sans-serif;
}
.relas1 .txt:nth-child(2){
  margin-left:5px;
}
.relas1 .txt:nth-child(1){
  margin-right:5px;
}
.relas1 .relation:last-child{
  margin-bottom:0px;
}
</style>
<div class="relas1"><div class="dec izq"><span></span><span></span><span></span></div><div class="dec dech"><span></span><span></span><span></span></div><div class="imagens" style="background:url(http://se.uploads.ru/XZThl.jpg)"><div class="caja"> 
  <br><b>Краткая характеристика, особые приметы, одним словом то, что должны знать о вашем персонаже другие игроки.</b>  <p><center>Черты характера:</center><center><img src="http://sf.uploads.ru/4q8bw.png" border="0" title="Название черты" width=30 height30></a><img src="http://sf.uploads.ru/4q8bw.png" border="0" title="Название черты" width=30 height30></a><img src="http://sf.uploads.ru/4q8bw.png" border="0" title="Название черты" width=30 height30></a><img src="http://sf.uploads.ru/4q8bw.png" border="0" title="Название черты" width=30 height30></a></center></div><div class="datos"><span><b>Имя Фамилия</b></span><span>Возраст</span><span>Место жительства</span><span>Специализация</span><span>Профессия</span><span>Семейное полож.</span></div></div><center><h><img src="http://se.uploads.ru/S1YEx.png"/></h></center>
<div class="relation"><div class="txt">Пробный пост от 3 до 6 тысяч символов на любую тему. Это может быть один из ваших постов, где-либо написанных ранее, рассказов или любых других художественных текстов, только под вашим авторством.</div></div>
</div>
</div>

Собственно код самой анкеты:

Код:

[+code]<+!--HTML-->
<style>
.relas1{
  background:#161d2b;
  width:475px;
  height:auto;
  padding:7px;
  margin:0 auto;
  position:relative;
  line-height:normal;
}
.relas1 .dec span{
  width:15px;
  height:15px;
  background:#8094b3;
  display:block;
  margin-bottom:3px;
}
.relas1 .dec{
  position:absolute;
}
.relas1 .dec.izq{
  top:0px;
  left:-20px;
}
.relas1 .dec.dech{
  bottom:-5px;
  right:-20px;
}
.relas1 .dec.izq span:nth-of-type(1), .relas1 .dec.dech span:nth-of-type(3){
  background:#161d2b;
}
.relas1 .dec span:nth-of-type(2){
  background:#4f6d9c;
}
.relas1 .imagens{
  width:475px;
  position:relative;
  height:260px;
  overflow:hidden;
}
.relas1 .caja{
  background: url(http://se.uploads.ru/Vlsay.png);
  width:194px;
  height:223px;
  position:absolute;
  top:-235px;
  left:15px;
  font:14px Jura;
   padding-left:11px;
     padding-top:1px;
  overflow-y:auto;
  transition:ease-in-out 1.2s;
}
.relas1 .imagens:hover .caja {
  top:14px;
}
.relas1 .datos{
  position:absolute;
  width:210px;
  right:15px;
  top:6px;
  height:220px;
}
.relas1 .datos span{
  display:block;
  background: url(http://se.uploads.ru/NZXCE.png);
  text-align:center;
  font:17px Jura;
  text-transform:uppercase;
  letter-spacing:2px;
  padding:9px 0;
  position:relative;
  transition:ease-in-out 1s;
  margin-bottom:4px;
  bottom:-255px;
}
.relas1 .imagens:hover .datos span{
  bottom:0px;
}
.relas1 .imagens:hover .datos span:nth-of-type(2){
transition-delay:0.4s;
}
.relas1 .imagens:hover .datos span:nth-of-type(3){
transition-delay:0.8s;
}
.relas1 .imagens:hover .datos span:nth-of-type(4){
transition-delay:1.2s;
}
.relas1 .imagens:hover .datos span:nth-of-type(5){
transition-delay:1.6s;
}
.relas1 .imagens:hover .datos span:nth-of-type(6){
transition-delay:2.0s;
}
.relas1 .relation{
  background:#ced6e3;
  margin:-2px 0;
  height:105px;
  border-width:0px 0;
  border-color:#161d2b transparent #1d2b43;
  border-style:solid;
  padding:5px;
}
.relas1 .txt{
  display:inline-block;
  width:475px;
height:105px;
  box-sizing:border-box;
  padding-right:1px;
  overflow-y:auto;
  ;vertical-align:top;
  font:13px sans-serif;
}
.relas1 .txt:nth-child(2){
  margin-left:5px;
}
.relas1 .txt:nth-child(1){
  margin-right:5px;
}
.relas1 .relation:last-child{
  margin-bottom:0px;
}
</style>
<div class="relas1"><div class="dec izq"><span></span><span></span><span></span></div><div class="dec dech"><span></span><span></span><span></span></div><div class="imagens" style="background:url(СЮДА ВСТАВИТЬ ССЫЛКУ НА КАРТИНКУ, КОТОРАЯ БУДУТ ФОНОВЫМ ИЗОБРАЖЕНИЕМ РАЗМЕРОМ 475Х260)"><div class="caja"> 
  <br><b>Краткая характеристика, особые приметы, одним словом то, что должны знать о вашем персонаже другие игроки.</b>  <p><center>Черты характера:</center><center><img src="ССЫЛКА НА КАРТИНКУ ЧЕРТ ХАРАКТЕРА" border="0" title="НАЗВАНИЕ ЧЕРТЫ ХАРАКТЕРА" width=30 height30></a><img src="ССЫЛКА НА КАРТИНКУ ЧЕРТ ХАРАКТЕРА" border="0" title="НАЗВАНИЕ ЧЕРТЫ ХАРАКТЕРА" width=30 height30></a><img src="ССЫЛКА НА КАРТИНКУ ЧЕРТ ХАРАКТЕРА" border="0" title="НАЗВАНИЕ ЧЕРТЫ ХАРАКТЕРА" width=30 height30></a><img src="ССЫЛКА НА КАРТИНКУ ЧЕРТ ХАРАКТЕРА" border="0" title="НАЗВАНИЕ ЧЕРТЫ ХАРАКТЕРА" width=30 height30></a></center></div><div class="datos"><span><b>Имя Фамилия</b></span><span>Возраст</span><span>Место жительства</span><span>Специализация</span><span>Профессия</span><span>Семейное полож.</span></div></div><center><h><img src="http://se.uploads.ru/S1YEx.png"/></h></center>
<div class="relation"><div class="txt">Пробный пост от 3 до 6 тысяч символов на любую тему. Это может быть один из ваших постов, где-либо написанных ранее, рассказов или любых других художественных текстов, только под вашим авторством.</div></div>
</div>
</div>[+/code]

Ansion

Меню навигации

Пользовательские ссылки

Информация о пользователе

Шаблон анкеты

Сообщений 1 страница 1 из 1

Поделиться12016-02-01 08:45:47