[шаблон анкеты]

Страница: 1

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

Поделиться12015-09-13 00:06:34

Автор: paparazzi
администратор
Зарегистрирован: 2015-09-12
Приглашений: 0
Сообщений: 48
Уважение: +1
Провел на форуме:
11 часов 13 минут
Последний визит:
2015-09-27 13:27:04

Код:

<!--HTML--><div>
<center><div style="position: absolute; margin-top: 30px; margin-left: 220px; color: #ffffff; font-size: 24px; font-family: 'Lobster', serif; text-shadow: 1px 0px 1px #a1a1a1;">ПОЯСНЕНИЯ</div>
<img src="http://funkyimg.com/i/22mad.png">
<div style="background-image: url(http://funkyimg.com/i/22mac.png); width: 600px">
<div style="width: 500px; padding-left: 18px; padding-right: 23px; text-align: justify;">
<center><b>СОЗДАЕМ 2 СООБЩЕНИЯ С ОТНОШЕНИЯМИ И ХРОНОЛОГИЕЙ СРАЗУ ПОСЛЕ АНКЕТЫ!</b><br>
▲ Название темы: Имя Фамилия на англ. Например: Amanda Seyfried. <br>
▲ Настоятельно рекомендуем <b>не менять</b> значения, прописанные в коде.<br>
▲ Не забываем вставлять весь пост в тег [ code ][/ code].<br>
▲ Если у вас возникли какие-либо вопросы, отправляйтесь в лс любому администратору.</center>
</div>
<img src="http://funkyimg.com/i/22mae.png">
</div></center></center></div>

Код:

<!--HTML--><link href='http://fonts.googleapis.com/css?family=Fjalla+One|Miniver|Montserrat|Old+Standard+TT:400italic|PT+Sans+Narrow' rel='stylesheet' type='text/css'>
<table><tbody><tr><style type="text/css">
#jinxthree { position: relative; width: 350px; padding: 25px; background-image: url(http://i60.tinypic.com/2qw0xkx.png); background-color: #f3f3fc; background-blend-mode: multiply; border-radius: 5%;}
#jinxthree .titleone { width: 350px; color: black; font: 26px/100% miniver; letter-spacing: -1px; text-transform: lowercase; margin-top: 10px; }
#jinxthree .titletwo { width: 300px; color: black; font: 10px/125% montserrat; text-transform: uppercase; text-align: justify; margin-top: 5px; }
#jinxthree .titletwo a { color: black; text-decoration: none; }
#jinxthree .text { width: 300px; height: 200px; padding: 25px; background: #fcfcfc; color: black; font: 12px/15px pt sans narrow; text-align: justify; letter-spacing: 1px; overflow: auto; border-radius: 5%;}
#jinxthree .text::-webkit-scrollbar { width: 10px; background: transparent; }
#jinxthree .text::-webkit-scrollbar-thumb { background: #fcfcfc; }
a.credit { position: relative; left: 125px; color: black; font: 8px arial; text-align: right; text-transform: uppercase; letter-spacing: 2px; text-decoration: none; }

</style><center><div id="jinxthree"><img src="http://images6.fanpop.com/image/photos/34500000/Amanda-amanda-seyfried-34507949-160-160.gif" style="width: 160px; height: 160px; padding: 10px; border-radius: 100%; border: solid 1px #C1CDC1; margin-top: -10px;">
<div class="titleone">ИМЯ НА АНГЛ</div>
<div class="titletwo"><center> ПРОФЕССИЯ | МЕСТО РОЖДЕНИЯ | ВОЗРАСТ</center> </div><p><div class="text">

<center>ЗДЕСЬ ПИШЕМ ВСЕ, ЧТО СЧИТАЕТЕ НУЖНЫМ. ПОПРОБУЙТЕ КАК МОЖНО ПОДРОБНЕЕ ОПИСАТЬ СВОЕГО ПЕРСОНАЖА, ЕГО ПРИВЫЧКИ, ХОББИ, СТРАХИ И ТД.</center>
</div></div></center></tr>
<tr><div id="p942-content" class="post-content">
            <p><strong></strong></p><style type="text/css">

#hardtimes { position: relative; width: 375px; height: 90px; overflow: hidden;}

#hardtimes .life { width: 375px; height: 90px; -moz-transition-duration: 1.3s;  -webkit-transition-duration: 1.3s;  -o-transition-duration: 1.3s; background-image: url(http://i60.tinypic.com/2qw0xkx.png); background-color: #f3f3fc; background-blend-mode: multiply; position: absolute; border-radius: 20px;}

#hardtimes:hover .life { top: -375px; background-color: #fff; -moz-transition-duration: 1.3s;  -webkit-transition-duration: 1.3s;  -o-transition-duration: 1.3s; border-radius: 20px;}

.pain { opacity: 0; width: 275px; height: 25px; background-color: #fff; position: relative; top: 100; -moz-transition-duration: 1.3s;  -webkit-transition-duration: 1.3s;  -o-transition-duration: 1.3s; font-family: calibri; text-transform: uppercase; font-size: 8px; letter-spacing: 2px; color: #000; text-align: center; line-height: 25px; border-radius: 20px;}

.pain:hover { opacity: 1; width: 275px; height: 25px; background-color: #fff; position: relative; top: 100; -moz-transition-duration: 1.3s;  -webkit-transition-duration: 1.3s;  -o-transition-duration: 1.3s; border-radius: 20px;}

</style>

<center>
<div style="width: 375px; height: 90px; padding: 10px; background-color: #fcfcfc; border-radius: 20px; border: 1px solid #eee;">

<div id="hardtimes">
<div class="life">
</div>
<div style="width: 275px; height: 90px; padding-right: 5px; overflow: auto; font: 12px/15px pt sans narrow">
<center><b>связь с вами:</b><br>
ответ<br>
<b>согласны ли вы быть целью местной сплетницы:</b><br>
ответ</center>
</center>
</div></div></tr></tbody></table></div></div>

Код:

<!*--HTML--><link href='http://fonts.googleapis.com/css?family=Fjalla+One|Miniver|Montserrat|Old+Standard+TT:400italic|PT+Sans+Narrow' rel='stylesheet' type='text/css'>
<table><tbody><tr><style type="text/css">
#jinxthree { position: relative; width: 350px; padding: 25px; background-image: url(http://i60.tinypic.com/2qw0xkx.png); background-color: #f3f3fc; background-blend-mode: multiply; border-radius: 5%;}
#jinxthree .titleone { width: 350px; color: black; font: 26px/100% miniver; letter-spacing: -1px; text-transform: lowercase; margin-top: 10px; }
#jinxthree .titletwo { width: 300px; color: black; font: 10px/125% montserrat; text-transform: uppercase; text-align: justify; margin-top: 5px; }
#jinxthree .titletwo a { color: black; text-decoration: none; }
#jinxthree .text { width: 300px; height: 200px; padding: 25px; background: #fcfcfc; color: black; font: 12px/15px pt sans narrow; text-align: justify; letter-spacing: 1px; overflow: auto; border-radius: 5%;}
#jinxthree .text::-webkit-scrollbar { width: 10px; background: transparent; }
#jinxthree .text::-webkit-scrollbar-thumb { background: #fcfcfc; }
a.credit { position: relative; left: 125px; color: black; font: 8px arial; text-align: right; text-transform: uppercase; letter-spacing: 2px; text-decoration: none; }

</style><center><div id="jinxthree"><img src="http://images6.fanpop.com/image/photos/34500000/Amanda-amanda-seyfried-34507949-160-160.gif" style="width: 160px; height: 160px; padding: 10px; border-radius: 100%; border: solid 1px #C1CDC1; margin-top: -10px;">
<div class="titleone">ИМЯ НА АНГЛ</div>
<div class="titletwo"><center> ПРОФЕССИЯ | МЕСТО РОЖДЕНИЯ | ВОЗРАСТ</center> </div><p><div class="text">

<center>ЗДЕСЬ ПИШЕМ ВСЕ, ЧТО СЧИТАЕТЕ НУЖНЫМ. ПОПРОБУЙТЕ КАК МОЖНО ПОДРОБНЕЕ ОПИСАТЬ СВОЕГО ПЕРСОНАЖА, ЕГО ПРИВЫЧКИ, ХОББИ, СТРАХИ И ТД.</center>
</div></div></center></tr>
<tr><div id="p942-content" class="post-content">
            <p><strong></strong></p><style type="text/css">

#hardtimes { position: relative; width: 375px; height: 90px; overflow: hidden;}

#hardtimes .life { width: 375px; height: 90px; -moz-transition-duration: 1.3s;  -webkit-transition-duration: 1.3s;  -o-transition-duration: 1.3s; background-image: url(http://i60.tinypic.com/2qw0xkx.png); background-color: #f3f3fc; background-blend-mode: multiply; position: absolute; border-radius: 20px;}

#hardtimes:hover .life { top: -375px; background-color: #fff; -moz-transition-duration: 1.3s;  -webkit-transition-duration: 1.3s;  -o-transition-duration: 1.3s; border-radius: 20px;}

.pain { opacity: 0; width: 275px; height: 25px; background-color: #fff; position: relative; top: 100; -moz-transition-duration: 1.3s;  -webkit-transition-duration: 1.3s;  -o-transition-duration: 1.3s; font-family: calibri; text-transform: uppercase; font-size: 8px; letter-spacing: 2px; color: #000; text-align: center; line-height: 25px; border-radius: 20px;}

.pain:hover { opacity: 1; width: 275px; height: 25px; background-color: #fff; position: relative; top: 100; -moz-transition-duration: 1.3s;  -webkit-transition-duration: 1.3s;  -o-transition-duration: 1.3s; border-radius: 20px;}

</style>

<center>
<div style="width: 375px; height: 90px; padding: 10px; background-color: #fcfcfc; border-radius: 20px; border: 1px solid #eee;">

<div id="hardtimes">
<div class="life">
</div>
<div style="width: 275px; height: 90px; padding-right: 5px; overflow: auto; font: 12px/15px pt sans narrow">
<center><b>связь с вами:</b><br>
ответ<br>
<b>согласны ли вы быть целью местной сплетницы:</b><br>
ответ</center>
</center>
</div></div></tr></tbody></table></div></div>

Цитировать Сообщение 1

Поделиться22015-09-13 00:08:20

Автор: paparazzi
администратор
Зарегистрирован: 2015-09-12
Приглашений: 0
Сообщений: 48
Уважение: +1
Провел на форуме:
11 часов 13 минут
Последний визит:
2015-09-27 13:27:04

Код:

<!--HTML--><div>
<center><div style="position: absolute; margin-top: 30px; margin-left: 220px; color: #ffffff; font-size: 24px; font-family: 'Lobster', serif; text-shadow: 1px 0px 1px #a1a1a1;">ПОЯСНЕНИЯ</div>
<img src="http://funkyimg.com/i/22mad.png">
<div style="background-image: url(http://funkyimg.com/i/22mac.png); width: 600px">
<div style="width: 500px; padding-left: 18px; padding-right: 23px; text-align: justify;">
<center><b>СОЗДАЕМ СООБЩЕНИЕ С ХРОНОЛОГИЕЙ СРАЗУ ПОСЛЕ АНКЕТЫ!</b></center><br>
▲ Вы вольны заполнять хронологию так, как вам захочется [этот код не обязателен]. <br>
▲ Не забываем вставлять весь пост в тег [ code ][/ code].<br>
▲ Если у вас возникли какие-либо вопросы или вы не можете самостоятельно заполнить хронологию, отправляйтесь в лс любому администратору.
</div>
<img src="http://funkyimg.com/i/22mae.png">
</div></center></center></div>

Код:

<!--HTML--><link href='http://fonts.googleapis.com/css?family=Kaushan+Script' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700' rel='stylesheet' type='text/css'>
<center>
<div class="corion">
<div class="corion2">
<div class="orionhead"><div style="position:relative; top:39px;">chronology</div>
</div>
<div class="orionhead2"></div>
</div>
<div class="orions">

<div class="orion">
<input type="radio" id="orion-1" name="orion-group-1" checked>
<label for="orion-1"><b>настоящее</b></label>
<div class="orionc">
<a href="ссылка на эпизод"><b>название эпизода</b></a> ~ участник & участник <br>
► <i>[активен\заморожен\закончен]</i> <br>
<a href="ссылка на эпизод"><b>название эпизода</b></a> ~ участник & участник <br>
► <i>[активен\заморожен\закончен]</i> <br>
</div>
</div>

<div class="orion">
<input type="radio" id="orion-2" name="orion-group-1">
<label for="orion-2"><b>прошлое</b></label>
<div class="orionc">
<a href="ссылка на эпизод"><b>название эпизода</b></a> ~ участник & участник <br>
► <i>[активен\заморожен\закончен]</i> <br>
<a href="ссылка на эпизод"><b>название эпизода</b></a> ~ участник & участник <br>
► <i>[активен\заморожен\закончен]</i> <br>
</div>
</div>

<div class="orion">
<input type="radio" id="orion-3" name="orion-group-1">
<label for="orion-3"><b>альтернатива</b></label>
<div class="orionc">
<a href="ссылка на эпизод"><b>название эпизода</b></a> ~ участник & участник <br>
► <i>[активен\заморожен\закончен]</i> <br>
<a href="ссылка на эпизод"><b>название эпизода</b></a> ~ участник & участник <br>
► <i>[активен\заморожен\закончен]</i> <br>
</div>
</div>

</div></div></center>

<style type="text/css">
.corion {
  width: 400px;
  padding: 15px;
  height: 400px;
  background-image: url(http://i60.tinypic.com/2qw0xkx.png); 
  background-color: #f3f3fc; 
  background-blend-mode: multiply; 
  border-radius: 5%;
  border: 7px solid #fff
  }

.corion2 {
  width: 400px;
  height: 150px
  }

.orionhead {
  width: 230px;
  font-family: "Kaushan Script";
  font-size: 32px;
  text-transform: lowercase;
  line-height: 100%;
  position: relative;
  float: left;
  height: 150px;
  color: #333
  }

.orionhead2 {
  width: 100px;
  height: 100px;
  position: relative;
  float: right;
  border-radius: 5%;
  border: 10px solid #fff;
  background-image: url(http://38.media.tumblr.com/8d50caec425feae94769473a7a8c72b1/tumblr_inline_mzkxq4OcNK1qh1l3k.gif)
  }

.orions {
  position: relative;
  width: 400px;
  height: 250px;
  overflow: hidden
  }

.orion {
  float: left
  }

.orion label {
  background: #eee;
  height: 25px;
  margin-bottom: 5px;
  position: relative;
  display: block;
  line-height: 25px;
  width: 100px;
  text-align: center;
  text-transform: uppercase;
  font-family: open sans condensed;
  font-weight: 300
  }

.orion [type=radio] {
  display: none
  }

.orionc {
  position: absolute;
  top: 30px;
  bottom: 0;
  left: 0;
  right: 0;
  width: 370px;
  height: 250px;
  background-color: #fff; 
  color: black;
  padding:20px;
  overflow: auto;
  text-align: justify;
  font-family: arial;
  font-size: 12px;
  line-height: 100%;
 

border: 1px solid #eee;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  opacity: 0;
  -moz-transition-duration: 0.1s;
  -o-transition-duration: 0.1s;
  -webkit-transition-duration: 0.1s;
  transition-duration: 0.1s
  }

.orions [type=radio]:checked ~ label {
  background: white;
  z-index: 2
  }
.orions [type=radio]:checked ~ label ~ .orionc {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=100);
  opacity: 1;
  z-index: 5
  }
.libcred a {
   font-family: orator std;
   font-size: 8px;
   color: #03435e;
   padding-right: 10px;
   padding-top:10px;
   line-height: 8px;
   letter-spacing: 1px
   }
</style>

Код:

<!*--HTML-->


<link href='http://fonts.googleapis.com/css?family=Kaushan+Script' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700' rel='stylesheet' type='text/css'>
<center>
<div class="corion">
<div class="corion2">
<div class="orionhead"><div style="position:relative; top:39px;">chronology</div>
</div>
<div class="orionhead2"></div>
</div>
<div class="orions">

<div class="orion">
<input type="radio" id="orion-1" name="orion-group-1" checked>
<label for="orion-1"><b>настоящее</b></label>
<div class="orionc">
<a href="ссылка на эпизод"><b>название эпизода</b></a> ~ участник & участник <br>
► <i>[активен\заморожен\закончен]</i> <br>
<a href="ссылка на эпизод"><b>название эпизода</b></a> ~ участник & участник <br>
► <i>[активен\заморожен\закончен]</i> <br>
</div>
</div>

<div class="orion">
<input type="radio" id="orion-2" name="orion-group-1">
<label for="orion-2"><b>прошлое</b></label>
<div class="orionc">
<a href="ссылка на эпизод"><b>название эпизода</b></a> ~ участник & участник <br>
► <i>[активен\заморожен\закончен]</i> <br>
<a href="ссылка на эпизод"><b>название эпизода</b></a> ~ участник & участник <br>
► <i>[активен\заморожен\закончен]</i> <br>
</div>
</div>

<div class="orion">
<input type="radio" id="orion-3" name="orion-group-1">
<label for="orion-3"><b>альтернатива</b></label>
<div class="orionc">
<a href="ссылка на эпизод"><b>название эпизода</b></a> ~ участник & участник <br>
► <i>[активен\заморожен\закончен]</i> <br>
<a href="ссылка на эпизод"><b>название эпизода</b></a> ~ участник & участник <br>
► <i>[активен\заморожен\закончен]</i> <br>
</div>
</div>

</div></div></center>

<style type="text/css">
.corion {
  width: 400px;
  padding: 15px;
  height: 400px;
  background-image: url(http://i60.tinypic.com/2qw0xkx.png); 
  background-color: #f3f3fc; 
  background-blend-mode: multiply; 
  border-radius: 5%;
  border: 7px solid #fff
  }

.corion2 {
  width: 400px;
  height: 150px
  }

.orionhead {
  width: 230px;
  font-family: "Kaushan Script";
  font-size: 32px;
  text-transform: lowercase;
  line-height: 100%;
  position: relative;
  float: left;
  height: 150px;
  color: #333
  }

.orionhead2 {
  width: 100px;
  height: 100px;
  position: relative;
  float: right;
  border-radius: 5%;
  border: 10px solid #fff;
  background-image: url(ССЫЛКА НА ИЗОБРАЖЕНИЕ 100 НА 100)
  }

.orions {
  position: relative;
  width: 400px;
  height: 250px;
  overflow: hidden
  }

.orion {
  float: left
  }

.orion label {
  background: #eee;
  height: 25px;
  margin-bottom: 5px;
  position: relative;
  display: block;
  line-height: 25px;
  width: 100px;
  text-align: center;
  text-transform: uppercase;
  font-family: open sans condensed;
  font-weight: 300
  }

.orion [type=radio] {
  display: none
  }

.orionc {
  position: absolute;
  top: 30px;
  bottom: 0;
  left: 0;
  right: 0;
  width: 370px;
  height: 250px;
  background-color: #fff; 
  color: black;
  padding:20px;
  overflow: auto;
  text-align: justify;
  font-family: arial;
  font-size: 12px;
  line-height: 100%;
 

border: 1px solid #eee;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  opacity: 0;
  -moz-transition-duration: 0.1s;
  -o-transition-duration: 0.1s;
  -webkit-transition-duration: 0.1s;
  transition-duration: 0.1s
  }

.orions [type=radio]:checked ~ label {
  background: white;
  z-index: 2
  }
.orions [type=radio]:checked ~ label ~ .orionc {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=100);
  opacity: 1;
  z-index: 5
  }
.libcred a {
   font-family: orator std;
   font-size: 8px;
   color: #03435e;
   padding-right: 10px;
   padding-top:10px;
   line-height: 8px;
   letter-spacing: 1px
   }
</style>

Отредактировано paparazzi (2015-09-13 09:55:56)

Цитировать Сообщение 2

Поделиться32015-09-13 00:16:21

Автор: paparazzi
администратор
Зарегистрирован: 2015-09-12
Приглашений: 0
Сообщений: 48
Уважение: +1
Провел на форуме:
11 часов 13 минут
Последний визит:
2015-09-27 13:27:04

Код:

<!--HTML--><div>
<center><div style="position: absolute; margin-top: 30px; margin-left: 220px; color: #ffffff; font-size: 24px; font-family: 'Lobster', serif; text-shadow: 1px 0px 1px #a1a1a1;">ПОЯСНЕНИЯ</div>
<img src="http://funkyimg.com/i/22mad.png">
<div style="background-image: url(http://funkyimg.com/i/22mac.png); width: 600px">
<div style="width: 500px; padding-left: 18px; padding-right: 23px; text-align: justify;">
<center><b>СОЗДАЕМ СООБЩЕНИЕ С ОТНОШЕНИЯМИ СРАЗУ ПОСЛЕ АНКЕТЫ!</b><br></center>
▲ Вы вольны заполнять отношения так, как вам захочется [этот код не обязателен]. <br>
▲ Не забываем вставлять весь пост в тег [ code ][/ code].<br>
▲ Если у вас возникли какие-либо вопросы или вы не можете самостоятельно заполнить отношения, отправляйтесь в лс любому администратору.
</div>
<img src="http://funkyimg.com/i/22mae.png">
</div></center></center></div>

Код:

<!--HTML--><div class="post-box">
            <table><tr><td><center><link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
<style type="text/css">
#base { background-color: #fff; width: 245px; border-radius: 20px; padding: 20px;}
#spacer { height: 10px; width: 10px; border-radius: 20px;}
.hover { width: 225px; height: 115px; border-radius: 20px; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s; opacity: 0;}
.hover:hover { background-color: #fff; width: 225px; height: 115px; opacity: .9 }
#position1 { width: 225px; border-radius: 20px; position: relative; top: 20px; font: 20px oswald; }
#position2 { width: 225px; position: relative; top: 15px;font: 11px calibri; text-transform: uppercase; letter-spacing: 1px; }
#position3 { width: 225px; border-radius: 20px; position: relative; top: 30px; font: 11px calibri; text-transform: uppercase; letter-spacing: 1px; }
b3 { font-weight: bold; color: #ACCENT COLOR }
#post { font: 10px calibri; text-align: justify; }
.scroller::-webkit-scrollbar { width: 3px; }
.scroller::-webkit-scrollbar-track { background-color: transparent; }
.scroller::-webkit-scrollbar-thumb { background-color: #ACCENT COLOR; }
</style>
<center><div id="base"><div style="background-color: #fff; background-image: url(http://30.media.tumblr.com/eead698df793d595cf84e401f2a73b82/tumblr_msvxdx9KPz1rkeor5o1_250.gif); width: 245px; height: 135px; border-radius: 20px;"><div id="spacer"></div><div class="hover">

<div id="position1">NAME SURNAME</div>
<div id="position2">ПРОФЕССИЯ</div>
<div id="position3">РОЛЬ В ЖИЗНИ</div>

</div></div><div id="spacer"></div> <div style="width: 240px; max-height: 250px; overflow: auto; padding-right: 5px;" class="scroller"><div id="post">

ОПИСАНИЕ ОТНОШЕНИЙ

</div></div></div><a href="http://shine.b1.jcink.com/index.php?showuser=3537"><div style="width: 285px; font: 7px calibri; text-align: right; text-transform: uppercase;"></div></a>
</center></td>
<td><center><link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
<style type="text/css">
#base { background-color: #fff; width: 245px;border-radius: 20px;  padding: 20px;}
#spacer { height: 10px; width: 10px; border-radius: 20px; }
.hover { width: 225px; height: 115px; border-radius: 20px; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s; opacity: 0;}
.hover:hover { background-color: #fff; width: 225px; height: 115px; opacity: .9}
#position1 { width: 225px; border-radius: 20px; position: relative; top: 20px; font: 20px oswald; }
#position2 { width: 225px; position: relative; top: 15px;font: 11px calibri; text-transform: uppercase; letter-spacing: 1px; }
#position3 { width: 225px; border-radius: 20px; position: relative; top: 30px; font: 11px calibri; text-transform: uppercase; letter-spacing: 1px; }
b3 { font-weight: bold; color: #ACCENT COLOR }
#post { font: 10px calibri; text-align: justify; }
.scroller::-webkit-scrollbar { width: 3px; }
.scroller::-webkit-scrollbar-track { background-color: transparent; }
.scroller::-webkit-scrollbar-thumb { background-color: #ACCENT COLOR; }
</style>
<center><div id="base"><div style="background-color: #fff; background-image: url(http://30.media.tumblr.com/eead698df793d595cf84e401f2a73b82/tumblr_msvxdx9KPz1rkeor5o1_250.gif); width: 245px; height: 135px; border-radius: 20px;"><div id="spacer"></div><div class="hover">

<div id="position1">NAME SURNAME</div>
<div id="position2">ПРОФЕССИЯ</div>
<div id="position3">РОЛЬ В ЖИЗНИ</div>

</div></div><div id="spacer"></div> <div style="width: 240px; max-height: 250px; overflow: auto; padding-right: 5px;" class="scroller"><div id="post">

ОПИСАНИЕ ОТНОШЕНИЙ

</div></div></div><a href="http://shine.b1.jcink.com/index.php?showuser=3537"><div style="width: 285px; font: 7px calibri; text-align: right; text-transform: uppercase;"></div></a>
</center></td></tr></table>

Код:

<!*--HTML--><tr><td><center><link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
<style type="text/css">
#base { background-color: #fff; width: 245px; border-radius: 20px; padding: 20px; }
#spacer { height: 10px; width: 10px; border-radius: 20px; }
.hover { width: 225px; height: 115px; border-radius: 20px; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s; opacity: 0; }
.hover:hover { background-color: #fff; width: 225px; height: 115px; opacity: .9 }
#position1 { width: 225px; position: relative; top: 20px; font: 20px oswald; }
#position2 { width: 225px; position: relative; top: 15px;font: 11px calibri; text-transform: uppercase; letter-spacing: 1px; }
#position3 { width: 225px; position: relative; top: 30px; font: 11px calibri; text-transform: uppercase; letter-spacing: 1px; }
b3 { font-weight: bold; color: #ACCENT COLOR }
#post { font: 10px calibri; text-align: justify; }
.scroller::-webkit-scrollbar { width: 3px; }
.scroller::-webkit-scrollbar-track { background-color: transparent; }
.scroller::-webkit-scrollbar-thumb { background-color: #ACCENT COLOR; }
</style>
<center><div id="base"><div style="background-color: #fff; background-image: url(ССЫЛКА НА ИЗОБРАЖЕНИЕ: 245 НА 135); width: 245px; height: 135px; border-radius: 20px;"><div id="spacer"></div><div class="hover">

<div id="position1">NAME SURNAME</div>
<div id="position2">ПРОФЕССИЯ ПРЕИМУЩЕСТВЕННО КАПСОМ</div>
<div id="position3">РОЛЬ В ТВОЕЙ ЖИЗНИ [БЛИЗКИЙ ДРУГ, ПОДРУГА]</div>

</div></div><div id="spacer"></div> <div style="width: 240px; max-height: 250px; overflow: auto; padding-right: 5px;" class="scroller"><div id="post">

ОПИСАНИЕ ОТНОШЕНИЙ

</div></div></div><a href="http://shine.b1.jcink.com/index.php?showuser=3537"><div style="width: 285px; font: 7px calibri; text-align: right; text-transform: uppercase;"></div></a>
</center></td>
<td><center><link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
<style type="text/css">
#base { background-color: #fff; width: 245px; border-radius: 20px; padding: 20px; }
#spacer { height: 10px; width: 10px; border-radius: 20px; }
.hover { width: 225px; height: 115px; border-radius: 20px; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s; opacity: 0; }
.hover:hover { background-color: #fff; width: 225px; height: 115px; opacity: .9 }
#position1 { width: 225px; position: relative; top: 20px; font: 20px oswald; }
#position2 { width: 225px; position: relative; top: 15px;font: 11px calibri; text-transform: uppercase; letter-spacing: 1px; }
#position3 { width: 225px; position: relative; top: 30px; font: 11px calibri; text-transform: uppercase; letter-spacing: 1px; }
b3 { font-weight: bold; color: #ACCENT COLOR }
#post { font: 10px calibri; text-align: justify; }
.scroller::-webkit-scrollbar { width: 3px; }
.scroller::-webkit-scrollbar-track { background-color: transparent; }
.scroller::-webkit-scrollbar-thumb { background-color: #ACCENT COLOR; }
</style>
<center><div id="base"><div style="background-color: #fff; background-image: url(ССЫЛКА НА ИЗОБРАЖЕНИЕ: 245 НА 135); width: 245px; height: 135px; border-radius: 20px;"><div id="spacer"></div><div class="hover">

<div id="position1">NAME SURNAME</div>
<div id="position2">ПРОФЕССИЯ ПРЕИМУЩЕСТВЕННО КАПСОМ</div>
<div id="position3">РОЛЬ В ЖИЗНИ [БЛИЗКИЙ ДРУГ, ПОДУРА] КАПСОМ</div>

</div></div><div id="spacer"></div> <div style="width: 240px; max-height: 250px; overflow: auto; padding-right: 5px;" class="scroller"><div id="post">

ОПИСАНИЕ ОТНОШЕНИЙ

</div></div></div><a href="http://shine.b1.jcink.com/index.php?showuser=3537"><div style="width: 285px; font: 7px calibri; text-align: right; text-transform: uppercase;"></div></a>
</center></td></tr></table>

▲Если вы хотите добавить еще 2 окна с отношениями, то перед < / t d >< / t r >< / t a b l e > вставляете этот код. <br>

хочу добавить 2 окна

Код:

<tr><td><center><link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
<style type="text/css">
#base { background-color: #fff; width: 245px; border-radius: 20px; padding: 20px; }
#spacer { height: 10px; width: 10px; border-radius: 20px; }
.hover { width: 225px; height: 115px; border-radius: 20px; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s; opacity: 0; }
.hover:hover { background-color: #fff; width: 225px; height: 115px; opacity: .9 }
#position1 { width: 225px; position: relative; top: 20px; font: 20px oswald; }
#position2 { width: 225px; position: relative; top: 15px;font: 11px calibri; text-transform: uppercase; letter-spacing: 1px; }
#position3 { width: 225px; position: relative; top: 30px; font: 11px calibri; text-transform: uppercase; letter-spacing: 1px; }
b3 { font-weight: bold; color: #ACCENT COLOR }
#post { font: 10px calibri; text-align: justify; }
.scroller::-webkit-scrollbar { width: 3px; }
.scroller::-webkit-scrollbar-track { background-color: transparent; }
.scroller::-webkit-scrollbar-thumb { background-color: #ACCENT COLOR; }
</style>
<center><div id="base"><div style="background-color: #fff; background-image: url(ССЫЛКА НА ИЗОБРАЖЕНИЕ: 245 НА 135); width: 245px; height: 135px; border-radius: 20px;"><div id="spacer"></div><div class="hover">

<div id="position1">NAME SURNAME</div>
<div id="position2">ПРОФЕССИЯ ПРЕИМУЩЕСТВЕННО КАПСОМ</div>
<div id="position3">РОЛЬ В ТВОЕЙ ЖИЗНИ [БЛИЗКИЙ ДРУГ, ПОДРУГА]</div>

</div></div><div id="spacer"></div> <div style="width: 240px; max-height: 250px; overflow: auto; padding-right: 5px;" class="scroller"><div id="post">

ОПИСАНИЕ ОТНОШЕНИЙ

</div></div></div><a href="http://shine.b1.jcink.com/index.php?showuser=3537"><div style="width: 285px; font: 7px calibri; text-align: right; text-transform: uppercase;"></div></a>
</center></td>
<td><center><link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
<style type="text/css">
#base { background-color: #fff; width: 245px; border-radius: 20px; padding: 20px; }
#spacer { height: 10px; width: 10px; border-radius: 20px; }
.hover { width: 225px; height: 115px; border-radius: 20px; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s; opacity: 0; }
.hover:hover { background-color: #fff; width: 225px; height: 115px; opacity: .9 }
#position1 { width: 225px; position: relative; top: 20px; font: 20px oswald; }
#position2 { width: 225px; position: relative; top: 15px;font: 11px calibri; text-transform: uppercase; letter-spacing: 1px; }
#position3 { width: 225px; position: relative; top: 30px; font: 11px calibri; text-transform: uppercase; letter-spacing: 1px; }
b3 { font-weight: bold; color: #ACCENT COLOR }
#post { font: 10px calibri; text-align: justify; }
.scroller::-webkit-scrollbar { width: 3px; }
.scroller::-webkit-scrollbar-track { background-color: transparent; }
.scroller::-webkit-scrollbar-thumb { background-color: #ACCENT COLOR; }
</style>
<center><div id="base"><div style="background-color: #fff; background-image: url(ССЫЛКА НА ИЗОБРАЖЕНИЕ: 245 НА 135); width: 245px; height: 135px; border-radius: 20px;"><div id="spacer"></div><div class="hover">

<div id="position1">NAME SURNAME</div>
<div id="position2">ПРОФЕССИЯ ПРЕИМУЩЕСТВЕННО КАПСОМ</div>
<div id="position3">РОЛЬ В ЖИЗНИ [БЛИЗКИЙ ДРУГ, ПОДУРА] КАПСОМ</div>

</div></div><div id="spacer"></div> <div style="width: 240px; max-height: 250px; overflow: auto; padding-right: 5px;" class="scroller"><div id="post">

ОПИСАНИЕ ОТНОШЕНИЙ

</div></div></div><a href="http://shine.b1.jcink.com/index.php?showuser=3537"><div style="width: 285px; font: 7px calibri; text-align: right; text-transform: uppercase;"></div></a>
</center></td>

Цитировать Сообщение 3

Ответить

Страница: 1

RED CARPET

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

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

Объявление

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

[шаблон анкеты]

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

Поделиться12015-09-13 00:06:34

Поделиться22015-09-13 00:08:20

Поделиться32015-09-13 00:16:21