Cikkajánló
Ez is egy olyan leírás, amit azért teszek fel az oldalra, mert már hangzott el kérdés róla. Hogyan lehet olyan modult készíteni, amiben minta is van? Például ez a
Ez a cikk csak egy vélemény a tapasztalataim alapján. Mostanában elég sok Blogspotos oldallal találkozom. Vagyis hát az évek alatt belefutottam már párba és sajnos nem igazán van ezekről
Ez a leírás azért jutott eszembe, mert nekem is szükségem volt valamire, amivel ezt meg tudom oldani, ugyanis próbálom majdnem minden leírásomat áttenni bejegyzésbe és az oldalakat meg törlöm.
Prémium téma | Ellie Goulding G-Portálos téma WordPress | Bejegyzés nem jelenik meg a főoldalon Gal Gadot G-Portálos téma Emilia Clarke G-Portálos téma Cole Sprouse 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
252 megtekintés

Hozzászólások