Cikkajánló
Joseph Morgan Matthew Goode Norman Reedus Ian Fansite Selena Gomez Miley Cyrus Fansite Ashley Tisdale Demi Lovato Fansite   Hoztam egy képeffektet, amit például nagyon jól lehet használni elit
Ehhez a kódhoz már két másik hasonló is megtalálható az oldalon. Az egyik a legfrissebb cikkek megjelenítése, a másik a cikkajánló és most ez, amivel a legutoljára frissített cikkeket
4. rész   Magyarul a sitetop a szerkeszthető fejléc CSS kódrésze. Ha használjátok a szerkeszthető fejlécet pl. menünek vagy igazából bárminek, akkor a CSS kódban be lehet állítani, hogy
Instagram doboz weboldalra Project dobozok és egy Elit csere effekt Elit csere effekt szöveggel és képekkel Lana Del Rey és Kylie Jenner G-Portálos témák Maisie Williams G-Portálos téma
Képes project szövegdoboz 19.
Project címe: Szívek szállodája
Megjelenése: 2000. 06. 26
Típus: Sorozat

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Hírek Online Hivatalos Képek

 

A doboz DIV kódja

 

<div id="project">
<img align="left" class="block-img" src="ide jön a kiskép url címe" width="100" /> <b>Project címe:</b> Szívek szállodája<br />
<i>Megjelenése:</i> 2000. 06. 26<br />
<i>Típus:</i> Sorozat<br />
<blockquote>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
<br>
</blockquote>
<center><a href="/" class="project-link">Hírek</a> <a href="/" class="project-link">Online</a> <a href="/" class="project-link" target="_blank">Hivatalos</a> <a href="/" class="project-link" target="_blank">Képek</a></center>
</div>
<br>

 

CSS kód

 

<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,500&subset=latin-ext');
@import url('https://fonts.googleapis.com/css?family=Playfair+Display:400,700&subset=latin-ext');
#project {
margin: 0 auto;
width: 350px;
font-family: 'Playfair Display', serif;
font-size: 12px;
line-height: 21px;
}
.block-img { /* a kiskép kinézete */
padding: 6px;
margin: 0px 3px 0px 6px;
background: #111111;
border-radius: 60px;
}
div[id*="project"] blockquote { /* a tartalom kinézete */
margin: 5px 0px;
background: #111111 !important;
font-family: 'Playfair Display', serif;
font-size: 12px;
color: #F1F1F1 !important;
padding: 10px;
border: 0px !important;
}
div[id*="project"] b { /* cím kinézete */
font-family: Montserrat;
font-size: 11px;
color: #6A6A6A;
font-weight: 500 !important;
padding: 5px;
margin: 25px 0px 0px -5px;
width: 100%;
}
div[id*="project"] i {
font-size: 12px !important;
color: #80D2B4 !important;
font-weight: bold;
}
a.project-link:link, a.project-link:visited { /* linkek a doboz alatt */
font-family: Montserrat;
color: #ffffff;
font-size: 10px !important;
margin: 5px 0 5px 0;
background: #80D2B4;
padding: 5px 15px 5px 15px;
font-weight: 500 !important;
text-transform: uppercase;
text-shadow: 1px 1px 0px #43BC8E;
-webkit-transition: all .7s ease-in-out;
-moz-transition: all .7s ease-in-out;
-o-transition: all .7s ease-in-out;
transition: all .7s ease-in-out;
}
a.project-link:hover {
background: #111111;
text-decoration: none !important;
-webkit-transition: all .7s ease-in-out;
-moz-transition: all .7s ease-in-out;
-o-transition: all .7s ease-in-out;
transition: all .7s ease-in-out;
}
</style>

lindadesign Hozzászólások
94 megtekintés

Hozzászólások