кодики разные
Страница: 1
Сообщений 1 страница 4 из 4
Поделиться22018-04-11 13:07:20
Код:
<!--HTML--><link href="https://fonts.googleapis.com/css?family=Cousine|Playfair+Display:400|Raleway:400" rel="stylesheet"><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.2/css/font-awesome.min.css"><style>#heaven {padding: 20px; background-color: #fbfbfb; width: 530px; border: 1px solid #e0e0e0; height: 610px; position: relative;} .piece {background-color: #fff; width: 275px; height: 378px; border: 1px solid #e0e0e0;} .piece2 {padding-right: 10px; margin: 40px; text-align: justify; color: #222; font: 10px verdana; line-height: 115%; height: 300px; overflow: auto;} .piece2 b {font: 16px raleway; color: #9472be;} .piece2 i {color: #6592bc; font: 11px playfair display; font-style: italic;} .ofh {position: absolute; top: 20px; left: 20px; width: 225px; height: 598px; padding: 5px; background-color: #fff; border: 1px solid #e0e0e0;} .ofh2 {width: 225px; height: 598px; background-size: cover;} .wupoh {position: absolute; top: 20px; right: 20px; height: 609px;} .pohlyr1 {padding: 5px; background-color: #fff; border: 1px solid #e0e0e0; margin-bottom: 10px; width: 265px;} .pohlyr1 h1 {font: 42px raleway; letter-spacing: -4px; color: #fff; background: linear-gradient(to right, #6592bc 0%,#9472be 100%); padding: 20px; margin: 0px; display: block; text-transform: lowercase;} .pohlyr1 h1 sub {font: 8px cousine; text-transform: uppercase; display: block; letter-spacing: 0px; text-align:right;} .pohlyr1 h1 sub:before {content: ""; height: 1px; background-color: #fff; margin-right: 10px; width: 30px; display: inline-block; vertical-align: middle;} .pohlyr2 {position: absolute; left: 0px; bottom: 40px; background-color: #fff; border: 1px solid #e0e0e0; width: 175px;} .pohlyr2 h2 {margin: 0px; font: 8px cousine; text-transform: uppercase; margin: 15px; text-align: justify; line-height: 105%; height: 20px; overflow: auto; padding-right: 10px;} .pohlyr3 {position: absolute; bottom: 0px; right: 0px; padding: 5px; background-color: #fff; border: 1px solid #e0e0e0; margin-top: 10px; height: 80px;} .pohlyr3 div {background: linear-gradient(to left, #6592bc 0%,#9472be 100%); padding: 20px; width: 40px; display: block; height: 40px;} .pohlyr3 i {color: #fff; font-size: 46px;} .heaventag {position: absolute; bottom: -1px; left: 0px; width: 165px; text-align: left; padding: 5px; background-color: #fff; border: 1px solid #e0e0e0; color: #9472be; font: 20px raleway; text-transform: lowercase; letter-spacing: -1px;} .heaventag a {font: 20px raleway; letter-spacing: -1px; text-transform: lowercase; color: #9472be!important;}</style><center><div id="heaven"><div class="ofh"> <div class="ofh2" style="background-image: url(225x600 image here);"> </div></div><div class="wupoh"><div class="pohlyr1"><h1> baby don't cry <sub> cause everybody's gotta die sometime </sub></h1></div><div class="piece"><div class="piece2"> post here. </div></div><div class="pohlyr2"><h2> testing stuff here. this is where the notes go it also scrolls so don't feel about about writing a lot of shit. </h2></div><div class="pohlyr3"><div><i class="fa fa-quote-right"></i></div></div><div class="heaventag"> @tagged </div></div> </div><div style="width: 550px; font-family: arial; text-align: right; text-transform: uppercase; font-size: 7px;"><a href="https://shine.jcink.net/index.php?showuser=145">LAUZ ღゝ◡╹)ノ♡</a></div></center>
Поделиться32018-04-11 15:01:57
Код:
<!--HTML--><center> <div class="timeb"> <div class="time"> <h5>Timeline</h5> <div class="beg"></div> <div class="event left">some events can go on the left</div> <div class="event right">some events can go on the right</div> <div class="small"></div> <div class="event right">that was a small space between events</div> <div class="large"></div> <div class="event left">oh shit a big space </div> <div class="event right"><nom>text colored by group</nom> </div> <div class="event right"><t1>title</t1> that was a title</div> <div class="small"></div> <div class="event left">literally w/e u think <b>looks pretty</b></div> <div class="small"></div> <div class="event left"><mag>4/19/18</mag> - shawna makes a dope template to keep track of her confusing-ass timelines.<br><a href="URL">threadname</a></div> <div class="end"></div> </div></div> </center> <style type="text/css"> .timeb {width: 390px; height: auto; padding: 10px; border: 1px solid white; color: #666;} .time {width: 350px; height: auto; padding: 20px; background: white;} .beg {width: 20px; height: 30px; margin-bottom: -2px; margin-left: 1px;} .end {width: 20px; height: 30px; clear: both; margin-left: 1px;} .beg:before, .end:after{content:"●"; width: 10px; height: 20px; display: block; font: normal normal 16px/10px times; color: #888; margin-left: 0px; margin-top: -2px;} .beg:after, .end:before {content:""; background:#888; width: 1px; height: 20px; display: block; margin-top: -12px;} .time .small {width: 175px; height: 30px; border-right: 1px solid #888; float: left;} .time .large {width: 175px; height: 50px; border-right: 1px solid #888; float: left;} .event {width: 155px; height: auto; font: italic normal 10px/10px times; letter-spacing: .05em; padding: 4px 10px; color: #444; clear: both;} .event.left { border-right: 1px solid #888; float: left; text-align: right; } .event.right{width:154px;float: right; border-right: 0px; border-left: 1px solid #888; text-align: left;} .event t1 {display: block; font: normal normal 10px/14px montserrat; text-transform: uppercase; letter-spacing: .1em;} .event fr {color: #AC544F;} .event ma {color: #6c9eb1;} .event ns {color: #876AA1;} .event mag {color: #84a57c;} .event nom {color: #C06D9C;} .event st {color: #c88d6f;} .template h5, .appscontent h2, h5 { display: block; width: 235px; margin: 18px auto; padding: 10px 0px; border-top: 1px solid #929292; border-bottom: 1px solid #929292; text-align: center; font: 600 normal 9px/14px montserrat; text-transform: uppercase; letter-spacing: .2em; text-shadow: 0.1em 0.1em 1px rgba(150, 150, 150, .5);} .template h5 b, .appscontent h2 b, h5 b{font-weight: 600;} </style>
Поделиться42018-04-11 15:06:38
Код:
<!--HTML--> <div id="u1"> <div class="u2"></div><div class="u_image"> <!---- ссылка на квадратный гиф ----> <img src="https://giffiles.alphacoders.com/205/205458.gif"> </div><div class="u3" style="background-image:url('');background-size:cover;"></div><div class="u6" style="border-color: #FFF transparent #FFF transparent;"></div> <div class="u5"> <!---- имя на англ ----> <span>name surname</span> <i class="fa fa-heart-o" style="margin-top: 5px;margin-right: 5px;"></i></div> <div class="u4"> <!---- короткое описание перса ----> короткое описание персонажа, можно в шутливой форме переписать информацию из личного звания примерно на 180 символов </div><h1>с нами уже<br> <!---- количество дней ----> 265 дней</h1> <div class="u7"> <div style="padding: 12px; height: 310px; overflow: auto;"> <!---- вступление ----> Текст генерируется абзацами случайным образом от двух до десяти предложений в абзаце, что позволяет сделать текст более привлекательным и живым для визуально-слухового восприятия. <!---- вопрос ----> <br><br><b> -- По своей сути рыбатекст является альтернативой традиционному lorem ipsum </b><br><br> <!---- ответ ----> который вызывает у некторых людей недоумение при попытках прочитать рыбу текст. В отличии от lorem ipsum, текст рыба на русском языке наполнит любой макет непонятным смыслом и придаст неповторимый колорит советских времен. <!---- вопрос ----> <br><br><b> -- Текст генерируется абзацами случайным образом </b><br><br> <!---- ответ ----> Сайт рыбатекст поможет дизайнеру, верстальщику, вебмастеру сгенерировать несколько абзацев более менее осмысленного текста рыбы на русском языке, а начинающему оратору отточить навык публичных выступлений в домашних условиях. <!---- вопрос ----> <br><br><b> -- По своей сути рыбатекст является альтернативой традиционному lorem ipsum </b><br><br> <!---- ответ ----> который вызывает у некторых людей недоумение при попытках прочитать рыбу текст. В отличии от lorem ipsum, текст рыба на русском языке наполнит любой макет непонятным смыслом и придаст неповторимый колорит советских времен. </div> </div> </div>
Страница: 1