Спрашивайте - постараемся ответить исчерпывающе и быстро.
Переговорная.
Страница: 1
Сообщений 1 страница 5 из 5
Поделиться12015-04-19 23:53:22
- Администратор
- Зарегистрирован: 2015-02-16
- Приглашений: 0
- Сообщений: 65
- Уважение: [+0/-0]
- Провел на форуме:
21 час 59 минут - Последний визит:
2023-06-05 14:05:27
Поделиться22021-11-25 22:38:32
- Администратор
- Зарегистрирован: 2015-02-16
- Приглашений: 0
- Сообщений: 65
- Уважение: [+0/-0]
- Провел на форуме:
21 час 59 минут - Последний визит:
2023-06-05 14:05:27
Поделиться32021-11-27 22:22:19
- Администратор
- Зарегистрирован: 2015-02-16
- Приглашений: 0
- Сообщений: 65
- Уважение: [+0/-0]
- Провел на форуме:
21 час 59 минут - Последний визит:
2023-06-05 14:05:27
[html]<link href="https://fonts.googleapis.com/css?family=Ruda:400,500,700&display=swap&subset=cyrillic" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Rouge+Script&display=swap" rel="stylesheet">
<!-- хтмл черти-чего от вещего духа-->
<div class="prusheen-some" style="background: url(https://forumstatic.ru/files/001a/ae/03/64471.jpg)">
<div class="prusheen-inner">
<div class="prusheen-text">
<span>Иванов</span>
<div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque mollis ipsum purus, ut facilisis eros blandit eu. Quisque fringilla iaculis pulvinar. Vivamus odio turpis, rhoncus eget nulla rhoncus, tempus ultrices dui. Maecenas aliquam rhoncus leo, ac mollis est egestas id. In vel elementum nulla. Quisque pharetra dapibus purus, non eleifend elit mollis id. Aliquam vel ligula nec nisl porta efficitur. Mauris vitae aliquet ante. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras imperdiet eu neque in finibus. Ut sed ligula urna. Sed euismod nibh neque, vitae porta odio imperdiet sagittis.
Cras facilisis dui sodales orci fermentum, vitae volutpat leo faucibus. In non dolor eros. Sed facilisis, metus at egestas rhoncus, lorem ex hendrerit libero, quis pretium risus orci eget velit. Etiam euismod, lacus et venenatis facilisis, purus purus efficitur dui, a placerat ante dui id est.
</div></div>
</div>
</div>
<style>
/* css черти чего от вещего духа*/
.prusheen-some {
width: 500px;
height: 600px;
margin: auto;
position: relative;
}
.prusheen-inner {
background: #f5f5f5; /* цвет белой подложки */
width:500px;
height: 300px;
position: absolute;
bottom: -1px;
left: 0;
clip-path: polygon(0% 100%, 100% 100%, 100% 0%,0% 50%);
transition: all 1s cubic-bezier(.87,.11,.27,1.52) 0s}
.prusheen-text {
width: 350px;
margin: auto;
font: 500 10px/18px ruda; /* шрифт текста в большом блоке */
text-align: justify;
color: #1e1e1e; /* цвет шрифта */
margin-top: 150px;
transition: all 1s cubic-bezier(.87,.11,.27,1.52) 0s}
.prusheen-text > div {
column-count: 2; /* делает две колонки */
column-gap: 15px; /* расстояния между колонками */
overflow-y: auto;
height: 270px;
opacity: 0;
transition: all .5s linear 0s}
.prusheen-text > span {
display: block;
text-align: center;
font: 40px ruda script; /* шрифт текста заголовка */
height: 60px;
position: relative;
margin-bottom: 25px}
.prusheen-text > span:after {
content: "";
background: #555; /* цвет полосочки разделителя */
display: block;
height: 1px;
width: 100px;
position: absolute;
left:35%;
bottom: 0}
.prusheen-some:hover .prusheen-inner {
height: 450px;
clip-path: polygon(0% 100%, 100% 100%, 100% 0%,0% 0%);}
.prusheen-some:hover .prusheen-text {margin-top: 40px}
.prusheen-some:hover .prusheen-text > div {opacity: 1;
transition: all 1s linear .5s}
</style>[/html]
Поделиться42021-11-29 01:14:38
- Администратор
- Зарегистрирован: 2015-02-16
- Приглашений: 0
- Сообщений: 65
- Уважение: [+0/-0]
- Провел на форуме:
21 час 59 минут - Последний визит:
2023-06-05 14:05:27
Код:
<!--HTML--><center>
<div class="subtleplotter">
<table class="subtletable" cellspacing="0" cellpadding="0"><tr><td class="subtleimage">
<div class="sbtlimagehvr">
<div class="sbtlefilter"></div><div class="sbtlname"><b>Дарина Фролова</b>
<p>я мечтаю о... Роме</p>
</div>
<img src="https://i.imgur.com/OH0mQIH.jpg">
</div>
</td>
<td class="subtlecontent">
<div class="subtledescription">
<b>Тучка</b> она тучка тучка она вовсе не медведь ахахахаха тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка туч
ка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка.
<div class="subtlewants">дарина тучка</div>
она тучка тучка она вовсе не медведь ахахахаха тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка тучка.
</div>
</td>
</tr><tr>
<td class="subtlecontent">
<div class="subtledescription2">
<b>Вестиарий</b> что можно сказать про человека, которого зовут Вестиарий? пхахаха просто текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст
<div class="subtlewants2">вестушка весточка</div>
Что можно сказать про человека, которого зовут Вестиарий? пхахаха просто текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст
</div>
</td><td class="subtleimage">
<div class="sbtlimagehvr">
<div class="sbtlefilter"></div><div class="sbtlname"><b>Веста Шелковиц</b>
<p>I'm a fashion designer and people think, what do I know?</p>
</div>
<img src="https://i.imgur.com/4alxZoy.jpg">
</div>
</td>
</tr><tr>
<td class="subtleimage">
<div class="sbtlimagehvr">
<div class="sbtlefilter"></div><div class="sbtlname"><b>Кирилл Исаев</b>
<p>Я мечтаю о том, чтобы отец никогда не возвращался в мою жизнь</p>
</div>
<img src="https://i.imgur.com/xAuU3t0.jpg">
</div>
</td><td class="subtlecontent">
<div class="subtledescription">
<b>Сталина</b> на вас нет нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас
<div class="subtlewants">тиран и деспот</div>
Сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас сталина нет на вас
</div>
</td>
</tr>
</tr>
<td class="subtlecontent">
<div class="subtledescription2">
<b>Птичечка</b> Рома птичка, Яша птичка, Кот птичка, птичечка Рома птичка, Яша птичка, Кот птичка, птичечка Рома птичка, Яша птичка, Кот птичка, птичечка Рома птичка, Яша птичка, Кот птичка, птичечка Рома птичка, Яша птичка, Кот птичка, птичечка
<div class="subtlewants2">птичка, птичечка</div>
Рома птичка, Яша птичка, Кот птичка, птичечка Рома птичка, Яша птичка, Кот птичка, птичечка Рома птичка, Яша птичка, Кот птичка, птичечка Рома птичка, Яша птичка, Кот птичка, птичечка Рома птичка, Яша птичка, Кот птичка, птичечка Рома птичка, Яша птичка, Кот птичка, птичечка Рома птичка
</div>
</td><td class="subtleimage">
<div class="sbtlimagehvr">
<div class="sbtlefilter"></div><div class="sbtlname"><b>Роман Соболев</b>
<p>I'm a fashion designer and people think, what do I know?</p>
</div>
<img src="https://i.imgur.com/6kAHpqw.jpg">
</div>
</td>
</tr><tr>
<td class="subtleimage">
<div class="sbtlimagehvr">
<div class="sbtlefilter"></div><div class="sbtlname"><b>Антон Яковлев</b>
<p>I'm a fashion designer and people think, what do I know?</p>
</div>
<img src="https://i.imgur.com/LjWaafj.jpg">
</div>
</td>
<td class="subtlecontent">
<div class="subtledescription">
<b>Танцор диско</b> а ты танцуй Тошечка танцуй и улыбайся тебе ведь все это действительно идет не сомневайся а ты танцуй Тошечка танцуй и улыбайся тебе ведь все это действительно идет не сомневайся а ты танцуй Тошечка танцуй и улыбайся тебе ведь все это действительно идет не сомневайся
<div class="subtlewants">дэнс дэнс</div>
а ты танцуй Тошечка танцуй и улыбайся тебе ведь все это действительно идет не сомневайся а ты танцуй Тошечка танцуй и улыбайся тебе ведь все это действительно идет не сомневайся а ты танцуй Тошечка танцуй и улыбайся тебе ведь все это действительно идет не сомневайся
</div>
</td>
</tr><tr>
<td class="subtlecontent">
<div class="subtledescription2">
<b>кто здесь</b> кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь
<div class="subtlewants2"> кто здесь</div>
кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь кто здесь
</div>
</td><td class="subtleimage">
<div class="sbtlimagehvr">
<div class="sbtlefilter"></div><div class="sbtlname"><b>?????</b>
<p>I'm a fashion designer and people think, what do I know?</p>
</div>
<img src="http://i.imgbox.com/hh7mZP0O.png">
</div>
</td>
</tr><tr>
</table>
</div>
</center>
<style>
.subtleplotter {
position:relative;
}
.subtletable {
width:500px;
}
.subtleimage {
width:250px;
height:250px;
}
.sbtlimagehvr {
width:250px;
height:250px;
overflow:hidden;
}
.subtleimage img {
width:250px;
height:250px;
position:relative;
bottom:223px;
z-index:1;
transform:scale(1.1);-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-o-transform:scale(1.1);
transition:200ms;-ms-transition:200ms;-webkit-transition:200ms;-moz-transition:200ms;-o-transition:200ms;
}
.sbtlefilter {
width:250px;
height:250px;
position:absolute;
z-index:2;
background:rgba(1,1,1,0.8);
opacity:0;
transform:scale(0.9);-webkit-transform:scale(0.9);-moz-transform:scale(0.9);-o-transform:scale(0.9);
transition:200ms;-ms-transition:200ms;-webkit-transition:200ms;-moz-transition:200ms;-o-transition:200ms;
}
.sbtlname {
padding: 60px 25px;
position:relative;
left:14px;
top:15px;
width:170px;
height:100px;
z-index:3;
}
.sbtlname b {
font-family:Playfair Display;
color:#333;
font-size:25px;
opacity:1;
padding-bottom:25px;
position:relative;
top:25px;
text-align:center;
transition:200ms;-ms-transition:200ms;-webkit-transition:200ms;-moz-transition:200ms;-o-transition:200ms;
line-height:30px;
}
.sbtlname p {
position:relative;
font-family: Open Sans;
font-size:13px;
top:50px;
opacity:0;
text-align:justify;
line-height:13px;
transition:200ms;-ms-transition:200ms;-webkit-transition:200ms;-moz-transition:200ms;-o-transition:200ms;
}
.sbtlimagehvr:hover .sbtlefilter {
opacity:1;
transform:scale(1);-o-transform:scale(1);-webkit-transform:scale(1);-moz-transform:scale(1);
transition:200ms;-ms-transition:200ms;-webkit-transition:200ms;-moz-transition:200ms;-o-transition:200ms;
}
.sbtlimagehvr:hover img {
transform:scale(1);-webkit-transform:scale(1);-o-transform:scale(1);-moz-transform:scale(1);
transition:200ms;-ms-transition:200ms;-webkit-transition:200ms;-moz-transition:200ms;-o-transition:200ms;
}
.sbtlimagehvr:hover .sbtlname b {
color:#fcfcfc;
padding-bottom:0;
top:0;
border-bottom:#fcfcfc solid 3px;
transition:200ms;-ms-transition:200ms;-webkit-transition:200ms;-moz-transition:200ms;-o-transition:200ms;
}
.sbtlimagehvr:hover .sbtlname p {
opacity:1;
top:0;
color:#fcfcfc;
transition:200ms;-ms-transition:200ms;-webkit-transition:200ms;-moz-transition:200ms;-o-transition:200ms;
}
/***CONTENT***/
.subtlecontent {
width:250px;
height:250px;
background:#9cc5b3;
}
.subtlecontent:nth-child(odd) {
background:#edefef;
}
.subtledescription {
height:200px;
width:195px;
overflow:auto;
margin:25px;
padding:0 5px 0 0;
text-align:justify;
color:#010101;
font-family:Open Sans;
font-size:11px;
line-height:20px;
}
.subtledescription b {
color:#edefef;
text-transform:uppercase;
font-size:9px;
}
.subtledescription::-webkit-scrollbar {
width:5px;
background:none;
}
.subtledescription::-webkit-scrollbar-thumb {
border:none;
background: #9cc5b3;
border-radius:0;
}
.subtledescription::-webkit-scrollbar-track {
background:#d8162d;
border:none;
}
.subtledescription2 {
height:200px;
width:195px;
overflow:auto;
margin:25px;
padding:0 5px 0 0;
text-align:justify;
color:#010101;
font-family:Open Sans;
font-size:11px;
line-height:20px;
}
.subtledescription2 b {
color: #9cc5b3;
font-weight:900;
text-transform:uppercase;
font-size:9px;
}
.subtledescription2::-webkit-scrollbar {
width:5px;
background:none;
}
.subtledescription2::-webkit-scrollbar-thumb {
border:none;
background:#edefef;
border-radius:0;
}
.subtledescription2::-webkit-scrollbar-track {
background:#A19D43;
border:none;
}
.subtlewants {
background:#edefef;
padding:5px;
margin:10px;
font-style:italic;
}
.subtlewants2 {
background:#9cc5b3;
padding:5px;
margin:10px;
font-style:italic;
}
.subtlecredits, .subtlecredits a {
font-size:7px;
font-family:Open sans;
font-weight:bold;
text-transform:uppercase;
}
</style>
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic|Playfair+Display:400,700,900' rel='stylesheet' type='text/css'>Поделиться52021-11-29 01:20:47
- Администратор
- Зарегистрирован: 2015-02-16
- Приглашений: 0
- Сообщений: 65
- Уважение: [+0/-0]
- Провел на форуме:
21 час 59 минут - Последний визит:
2023-06-05 14:05:27
Код:
<!--HTML--><center>
<div class="subtleplotter">
<table class="subtletable" cellspacing="0" cellpadding="0"><tr><td class="subtleimage">
<div class="sbtlimagehvr">
<div class="sbtlefilter"></div><div class="sbtlname"><b>FRIENDS</b>
<p>I'm a fashion designer and people think, what do I know?</p>
</div>
<img src="https://i.imgur.com/nFDizOY.jpg">
</div>
</td>
<td class="subtlecontent">
<div class="subtledescription">
<b>Grumpy wizards</b> make toxic brew for the evil Queen and Jack. One morning, when Gregor Samsa woke from troubled dreams, he found himself transformed in his bed into a horrible vermin.
<div class="subtlewants">wanted plots</div>
He lay on his armour-like back, and if he lifted his head a little he could see his brown belly, slightly domed and divided by arches into stiff sections. The bedding was hardly able to cover it and seemed ready to slide off any moment. His many legs, pitifully thin compared with the size of the rest of him, waved about helplessly as he looked.
</div>
</td>
</tr><tr>
<td class="subtlecontent">
<div class="subtledescription2">
<b>Grumpy wizards</b> make toxic brew for the evil Queen and Jack. One morning, when Gregor Samsa woke from troubled dreams, he found himself transformed in his bed into a horrible vermin.
<div class="subtlewants2">wanted plots</div>
Интересно, что это такое?
</div>
</td><td class="subtleimage">
<div class="sbtlimagehvr">
<div class="sbtlefilter"></div><div class="sbtlname"><b>ENEMIES</b>
<p>I'm a fashion designer and people think, what do I know?</p>
</div>
<img src="https://i.imgur.com/fQzMZIg.jpg">
</div>
</td>
</tr><tr>
<td class="subtleimage">
<div class="sbtlimagehvr">
<div class="sbtlefilter"></div><div class="sbtlname"><b>LOVERS</b>
<p>Крокодилы-бегемоты</p>
</div>
<img src="https://i.imgur.com/JjdYbvt.jpg">
</div>
</td><td class="subtlecontent">
<div class="subtledescription">
<b>Проверим</b> И снова проверим
<div class="subtlewants">wanted plots</div>
И ещё раз проверим
</div>
</td>
</tr>
</table>
</div>
<div class="subtlecredits">von diesel of <a href="http://wicked-wonderland.boards.net/user/1289">♦</a> <a href="http://outofcontrolx.b1.jcink.com/index.php?showuser=75">♦</a> <a href="http://shine.jcink.net/index.php?showuser=21072">♦</a></div>
</center>
<style>
.subtleplotter {
position:relative;
}
.subtletable {
width:500px;
}
.subtleimage {
width:250px;
height:250px;
}
.sbtlimagehvr {
width:250px;
height:250px;
overflow:hidden;
}
.subtleimage img {
width:250px;
height:250px;
position:relative;
bottom:223px;
z-index:1;
transform:scale(1.1);-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-o-transform:scale(1.1);
transition:200ms;-ms-transition:200ms;-webkit-transition:200ms;-moz-transition:200ms;-o-transition:200ms;
}
.sbtlefilter {
width:250px;
height:250px;
position:absolute;
z-index:2;
background:rgba(1,1,1,0.8);
opacity:0;
transform:scale(0.9);-webkit-transform:scale(0.9);-moz-transform:scale(0.9);-o-transform:scale(0.9);
transition:200ms;-ms-transition:200ms;-webkit-transition:200ms;-moz-transition:200ms;-o-transition:200ms;
}
.sbtlname {
padding: 60px 25px;
position:relative;
left:14px;
top:15px;
width:170px;
height:100px;
z-index:3;
}
.sbtlname b {
font-family:Playfair Display;
color:#333;
font-size:25px;
opacity:1;
padding-bottom:25px;
position:relative;
top:25px;
text-align:center;
transition:200ms;-ms-transition:200ms;-webkit-transition:200ms;-moz-transition:200ms;-o-transition:200ms;
line-height:30px;
}
.sbtlname p {
position:relative;
font-family: Open Sans;
font-size:13px;
top:50px;
opacity:0;
text-align:justify;
line-height:13px;
transition:200ms;-ms-transition:200ms;-webkit-transition:200ms;-moz-transition:200ms;-o-transition:200ms;
}
.sbtlimagehvr:hover .sbtlefilter {
opacity:1;
transform:scale(1);-o-transform:scale(1);-webkit-transform:scale(1);-moz-transform:scale(1);
transition:200ms;-ms-transition:200ms;-webkit-transition:200ms;-moz-transition:200ms;-o-transition:200ms;
}
.sbtlimagehvr:hover img {
transform:scale(1);-webkit-transform:scale(1);-o-transform:scale(1);-moz-transform:scale(1);
transition:200ms;-ms-transition:200ms;-webkit-transition:200ms;-moz-transition:200ms;-o-transition:200ms;
}
.sbtlimagehvr:hover .sbtlname b {
color:#fcfcfc;
padding-bottom:0;
top:0;
border-bottom:#fcfcfc solid 3px;
transition:200ms;-ms-transition:200ms;-webkit-transition:200ms;-moz-transition:200ms;-o-transition:200ms;
}
.sbtlimagehvr:hover .sbtlname p {
opacity:1;
top:0;
color:#fcfcfc;
transition:200ms;-ms-transition:200ms;-webkit-transition:200ms;-moz-transition:200ms;-o-transition:200ms;
}
/***CONTENT***/
.subtlecontent {
width:250px;
height:250px;
background:#cb293d;
}
.subtlecontent:nth-child(odd) {
background:#CCC855;
}
.subtledescription {
height:200px;
width:195px;
overflow:auto;
margin:25px;
padding:0 5px 0 0;
text-align:justify;
color:#efefef;
font-family:Open Sans;
font-size:11px;
line-height:20px;
}
.subtledescription b {
color:#CCC855;
text-transform:uppercase;
font-size:9px;
}
.subtledescription::-webkit-scrollbar {
width:5px;
background:none;
}
.subtledescription::-webkit-scrollbar-thumb {
border:none;
background:#cb293d;
border-radius:0;
}
.subtledescription::-webkit-scrollbar-track {
background:#d8162d;
border:none;
}
.subtledescription2 {
height:200px;
width:195px;
overflow:auto;
margin:25px;
padding:0 5px 0 0;
text-align:justify;
color:#010101;
font-family:Open Sans;
font-size:11px;
line-height:20px;
}
.subtledescription2 b {
color:#cb293d;
font-weight:900;
text-transform:uppercase;
font-size:9px;
}
.subtledescription2::-webkit-scrollbar {
width:5px;
background:none;
}
.subtledescription2::-webkit-scrollbar-thumb {
border:none;
background:#CCC855;
border-radius:0;
}
.subtledescription2::-webkit-scrollbar-track {
background:#A19D43;
border:none;
}
.subtlewants {
background:#d14657;
padding:5px;
margin:10px;
font-style:italic;
}
.subtlewants2 {
background:#d6d48c;
padding:5px;
margin:10px;
font-style:italic;
}
.subtlecredits, .subtlecredits a {
font-size:7px;
font-family:Open sans;
font-weight:bold;
text-transform:uppercase;
}
</style>
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic|Playfair+Display:400,700,900' rel='stylesheet' type='text/css'>Страница: 1
