заявки

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

Поделиться12019-03-15 23:09:54

Автор: панда
Участник
2:
Сообщений: 16
Уважение: +0

[html]<a href="ссылка"><img src='http://sh.uploads.ru/4nLZh.png'
onmouseover="this.src='http://s8.uploads.ru/5Z6hv.png'"
onmouseout="this.src='http://sh.uploads.ru/4nLZh.png'" border=0>[/html]

Поделиться22019-03-15 23:09:59

Автор: панда
Участник
2:
Сообщений: 16
Уважение: +0

[html]
<style type="text/css">
.golliew {
width: 180px;
height: 180px;
margin: 10px;
border: 8px solid #232323;
overflow: hidden;
position: relative;
text-align: center;
-webkit-box-shadow: 1px 1px 2px #232323;
-moz-box-shadow: 1px 1px 2px #232323;
box-shadow: 1px 1px 2px #232323;
background: url(http://sh.uploads.ru/4nLZh.png) repeat center center;
}

.golliew .gollask,.golliew .gollent {
width: 180px;
height: 180px;
position: absolute;
overflow: hidden;
top: 0;
left: 0;
}

.golliew img {
display: block;
position: relative;
}

.golliew-ninth .gollask-1, .golliew-ninth .gollask-2 {
height: 180px;
width: 180px;
background: rgba(98,98,98,0.3);
-webkit-transition: all 0.3s ease-in-out 0.6s;
-moz-transition: all 0.3s ease-in-out 0.6s;
-o-transition: all 0.3s ease-in-out 0.6s;
transition: all 0.3s ease-in-out 0.6s;
}

.golliew-ninth .gollask-1 {
left: auto;
right: 0;
-webkit-transform: rotate(40.0deg) translateX(-600px);
-moz-transform: rotate(40.0deg) translateX(-600px);
-o-transform: rotate(40.0deg) translateX(-600px);
-ms-transform: rotate(40.0deg) translateX(-600px);
transform: rotate(40.0deg) translateX(-600px);
-webkit-transform-origin: 100% 0%;
-moz-transform-origin: 100% 0%;
-o-transform-origin: 100% 0%;
-ms-transform-origin: 100% 0%;
transform-origin: 100% 0%;
}

.golliew-ninth .gollask-2 {
top: auto;
bottom: 0;
-webkit-transform: rotate(40.0deg) translateX(600px);
-moz-transform: rotate(40.0deg) translateX(600px);
-o-transform: rotate(40.0deg) translateX(600px);
-ms-transform: rotate(40.0deg) translateX(600px);
transform: rotate(40.0deg) translateX(600px);
-webkit-transform-origin: 0% 100%;
-moz-transform-origin: 0% 100%;
-o-transform-origin: 0% 100%;
-ms-transform-origin: 0% 100%;
transform-origin: 0% 100%;
}

.golliew-ninth .gollent {
background-color: rgba(45,45,45,0.9);
color: #сссссс;
height: 0;
width: 180px;
overflow: hidden;
-webkit-transform: rotate(-33.5deg) translate(-112px, 166px);
-moz-transform: rotate(-33.5deg) translate(-112px, 166px);
-o-transform: rotate(-33.5deg) translate(-112px, 166px);
-ms-transform: rotate(-33.5deg) translate(-112px, 166px);
transform: rotate(-33.5deg) translate(-112px, 166px);
-webkit-transform-origin: 0% 100%;
-moz-transform-origin: 0% 100%;
-o-transform-origin: 0% 100%;
-ms-transform-origin: 0% 100%;
transform-origin: 0% 100%;
-webkit-transition: all 0.4s ease-in-out 0.3s;
-moz-transition: all 0.4s ease-in-out 0.3s;
-o-transition: all 0.4s ease-in-out 0.3s;
transition: all 0.4s ease-in-out 0.3s;
}

.golliew-ninth a.info {
display: none;
}

.golliew-ninth:hover .gollent {
height: 1200px;
width: 100px;
top: 220px;
left: 50px;
-webkit-transform: rotate(0deg) translate(0, 0);
-moz-transform: rotate(0deg) translate(0, 0);
-o-transform: rotate(0deg) translate(0, 0);
-ms-transform: rotate(0deg) translate(0, 0);
transform: rotate(0deg) translate(0, 0);
}

.golliew-ninth:hover .gollask-1, .golliew-ninth:hover .gollask-2 {
-webkit-transition-delay: 0s;
-moz-transition-delay: 0s;
-o-transition-delay: 0s;
transition-delay: 0s;
}

.golliew-ninth:hover .gollask-1 {
-webkit-transform: rotate(40.0deg) translateX(113px);
-moz-transform: rotate(40.0deg) translateX(1px);
-o-transform: rotate(40.0deg) translateX(1px);
-ms-transform: rotate(40.0deg) translateX(1px);
transform: rotate(40.0deg) translateX(1px);
}

.golliew-ninth:hover .gollask-2 {
-webkit-transform: rotate(40.0deg) translateX(-112px);
-moz-transform: rotate(40.0deg) translateX(-1px);
-o-transform: rotate(40.0deg) translateX(-1px);
-ms-transform: rotate(40.0deg) translateX(-1px);
transform: rotate(40.0deg) translateX(-1px);
}

.gollund {
overflow: hidden;
text-align: center;
color: #898989;
font-family: Courier New;
font-size: 11px;
text-transform: lowercase;
font-style: italic;
}

.gollund:before, .gollund:after {
background-color: #2f2f2f;
gollent: "";
display: inline-block;
height: 1px;
position: relative;
vertical-align: middle;
width: 50%;
}

.gollund:before {
right: 0.5em;
margin-left: -50%;
}

.gollund:after {
left: 0.5em;
margin-right: -50%;
}

.two-columns .column {
width: 50%;
float: left;
}

.gollinfo {
height: 95px;
overflow: auto;
padding: 4px;
font-family: Candara, sans-serif;
font-size: 12px;
color: #aaaaaa;
line-height: 13px;
vertical-align: text-middle;
text-align: center;
}

a.gollc {
font-size: 8px;
text-decoration: none;
color: black;
}
</style>

<center>
<div class="golliew golliew-ninth">
<img src="http://sh.uploads.ru/4nLZh.png" />
<div class="gollask gollask-1"></div>
<div class="gollask gollaskco-2"></div>
<div class="gollent">
<div style="padding: 4px;"><div class="gollinfo"><br /><br />I keep a close watch on this heart of mine<br />
I keep my eyes wide open all the time<br />
I keep the ends out for the tie that binds<br />
Because you’re mine, I walk the line<br /><br />
</div><br />
</div><br />

<div class="two-columns">
<div id="clm1" class="column"><div class="gollund">Syanna & Dettlaff</div></div>
<div id="clm2" class="column"><div class="gollund">Temeria</div></div>
</div>
</div>
</center>[/html]

Поделиться32019-03-15 23:56:19

Автор: панда
Участник
2:
Сообщений: 16
Уважение: +0

Код:

[html]<table  id="mini_gallery">
 <tr>
  <td class="gall_con">
   <div class="name">
      <table class="gt">
       <tr>
       <td>
        <div class="gall_row1">
        <a href="#"><img src="https://forumupload.ru/uploads/0007/e3/f7/38566-4-f.jpg"></a>
        <span>текст-описание</span>
        </div>
       </td>

       <td>
        <div class="gall_row1">
        <a href="#"><img src="https://forumupload.ru/uploads/0007/e3/f7/38566-4-f.jpg"></a>
        <span>текст-описание</span>
        </div>
       </td>

       <td>
        <div class="gall_row1">
        <a href="#"><img src="https://forumupload.ru/uploads/0007/e3/f7/38566-4-f.jpg"></a>
        <span>текст-описание</span>
        </div>
       </td>

       <td>
        <div class="gall_row1">
        <a href="#"><img src="https://forumupload.ru/uploads/0007/e3/f7/38566-4-f.jpg"></a>
        <span>текст-описание</span>
        </div>
       </td>

       <td>
        <div class="gall_row1">
        <a href="#"><img src="https://forumupload.ru/uploads/0007/e3/f7/38566-4-f.jpg"></a>
        <span>текст-описание</span>
        </div>
       </td>

       <td>
        <div class="gall_row1">
        <a href="#"><img src="https://forumupload.ru/uploads/0007/e3/f7/38566-4-f.jpg"></a>
        <span>текст-описание</span>
        </div>
       </td>
       </tr>
       <tr>
       <td>
        <div class="gall_row2">
        <a href="#"><img src="https://forumupload.ru/uploads/0007/e3/f7/38566-4-f.jpg"></a>
        <span>текст-описание</span>
        </div>
       </td>

       <td>
        <div class="gall_row2">
        <a href="#"><img src="https://forumupload.ru/uploads/0007/e3/f7/38566-4-f.jpg"></a>
        <span>текст-описание</span>
        </div>
       </td>

       <td>
        <div class="gall_row2">
        <a href="#"><img src="https://forumupload.ru/uploads/0007/e3/f7/38566-4-f.jpg"></a>
        <span>текст-описание</span>
        </div>
       </td>

       <td>
        <div class="gall_row2">
        <a href="#"><img src="https://forumupload.ru/uploads/0007/e3/f7/38566-4-f.jpg"></a>
        <span>текст-описание</span>
        </div>
       </td>

       <td>
        <div class="gall_row2">
        <a href="#"><img src="https://forumupload.ru/uploads/0007/e3/f7/38566-4-f.jpg"></a>
        <span>текст-описание</span>
        </div>
       </td>

       <td>
        <div class="gall_row2">
        <a href="#"><img src="https://forumupload.ru/uploads/0007/e3/f7/38566-4-f.jpg"></a>
        <span>текст-описание</span>
        </div>
       </td>
       </tr>
      </table>
   </div>
  </td>
 </tr>
</table>

Поделиться42019-03-25 17:05:32

Автор: beardman
Участник
3: Каз Бреккер, 20
the grishaverse

мне ничего не надо, я даю себя прочесть.
сломанный весь.
преград не преграда, я молю тебя «поверь».
сломанный весь.
Сообщений: 848
Уважение: +1

Люди-Икс
I волна
Prof. X // Mark Strong
Wolverine // Hugh Jackman
II волна
Cyclops // Richard Madden
Jean Grey // Riley Keough
Beast // Daniel Radcliffe
Angel // Ben Hardy
Iceman // Ansel Elgort
Storm // Zoe Kravitz
III волна
Colossus // Sean Depner
Shadowcat // Natalia Dyer
Nightcrawler // Benjamin Wadsworth
Rogue // Marie Avgeropoulos
Gambit // Gaspard Ulliel
Jubilee // Lana Condor

Братство Мутантов
I волна
Magneto // Jason Isaacs
Mystique // Evan Rachel Wood
Emma Frost // Katheryn Winnick
Victor Creed // Clive Standen
II волна
Polaris // Alycia Debnam-Carey
Quicksilver // Aaron Taylor-Johnson
Havok // Liam Hemsworth
III волна
Pyro // Jeremy Allen White
Toad // Robert Sheehan

Фантастическая Четвёрка
Mr. Fantastic // John Krasinski
Invisible Woman // Emily Blunt
Human Tourch // Tom Hopper
The Thing // David Harbour

Поделиться52019-04-16 21:54:19

Автор: панда
Участник
2:
Сообщений: 16
Уважение: +0

Код:

[html]<div class="spiritbox">
  <div class="spirit_pic"><img src="http://sh.uploads.ru/4nLZh.png"></div>
  <div class="spirit_title">ororo munroe
<div class="spirit_subtitle">storm</div></div>
  <div class="spirit_txt"><div>
Cras velit mauris, consequat ullamcorper luctus ut, vehicula quis enim. Fusce vehicula nunc sit amet ligula venenatis sodales. Vivamus ac arcu dui. Cras turpis justo, ullamcorper non tellus vel, facilisis venenatis velit. Aliquam elementum risus ultrices nisi gravida efficitur. Aenean pulvinar tellus convallis varius tincidunt. Cras molestie diam at dui vehicula viverra. Fusce id sapien neque. Suspendisse egestas varius arcu, quis lobortis augue. Ut ultricies semper lacus. Quisque sed commodo augue. Vestibulum leo risus, viverra vitae magna id, volutpat scelerisque felis. Proin aliquam elit et ipsum posuere malesuada.
</div>
</div>
 </div>

<style>
@import url('https://fonts.googleapis.com/css?family=Oswald:400,700|Play:400,700&subset=cyrillic');

.spiritbox {width: 130px;
height: 130px;
overflow: hidden;
position: relative;
display: block;
margin: auto}

.spirit_pic {width: 130px;
height: 130px;
transition: all 0.7s ease-in-out 0s}

.spirit_pic img {
max-height: 130px;}

.spirit_title {width: 200px;
position: absolute;
text-align: center;
margin-top:-90px;
font-family: oswald;
font-size: 16px;
font-weight: 700;
margin-left: 23px;
color: #999;
text-shadow: 1px 1px 1px #000;
text-transform: lowercase;
transition: all 0.7s ease-in-out 0s;
background: radial-gradient(ellipse at center, rgba(0,0,0,.8) 30%, rgba(255,255,255,0) 70%);
height: 55px}

.spirit_subtitle {box-shadow: 0 -2px 0 0 #999;
text-align: center;
font-family: play;
font-size: 8px;
font-weight: 200;
color: #dfdfdf;
text-shadow: 1px 1px 1px #000;
text-transform: uppercase;
transition: all 0.3s ease-in-out 0s;
padding-top: 2px;
margin-top: 5px}

.spirit_txt {width: 210px;
height: 90px;
text-align: justify;
font-family: tahoma;
font-size: 10px;
margin-top: 0px;
position: absolute;
background-color: rgba(255,255,255,0.8);
line-height: 11px;
margin-left: 18px;
opacity: 0;
transition: all 0.7s ease-in-out 0s;}

.spirit_txt div {
overflow-y: auto;
padding-right: 3px;
  margin: 7px 7px;
  height: 74px
}

.spirit_txt div::-webkit-scrollbar {
width: 6px;
height:6px;
background-color: transparent;}

.spirit_txt div::-webkit-scrollbar-thumb {
  background-color:#333;
  width:6px !important;
  box-shadow: 0 0 0 1px rgba(255, 255, 255,0.1) inset;
}

.spiritbox:hover .spirit_pic {filter: grayscale(100%) blur(2px);
transform: scale(1.2)}

.spiritbox:hover .spirit_title {margin-top: -170px}
.spiritbox:hover .spirit_txt {margin-top: -110px;
opacity: 1}</style>

Мастерская vol.2

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

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