Cikkajánló
Elkészült az oldal legújabb kinézete. Kicsit ősziesebbre sikeredett, de nem is baj, mert hát már lassan ősz van. Most, hogy egy kicsit több időm volt végre foglalkozni az oldallal,
Ha már elsőnek leírtam a rendes táblázat készítését, gondoltam leírok még egy verziót, mikor nem táblázatban, hanem DIV kódba teszitek a tartalmat. Nekem személy szerint egyre megy. Kinézetre úgy
3. rész   Ebben a részben a td.sitecol-lal ismerkedünk meg. Általában a nagy többség csak arra használja, hogy a modulok alatt másmilyen színű legyen a háttér, mint az oldal
Emma Roberts G-Portálos téma 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
Képes project szövegdoboz 14.

 

Ikon kódja

 

<script src="https://use.fontawesome.com/9f3339f954.js"></script>

 

Szövegdoboz kódja

 

<div class="project"><img src="IDE JÖN A KÉP URL CÍME" class="center">
<div class="title">Film címe lehet</div>
<div class="quote">
TARTALMI RÉSZ
</div>
<div class="project-links"><a href="/" target="new"><i class="fa fa-link" aria-hidden="true"></i> Adatok</a> <a href="" target="new"><i class="fa fa-camera" aria-hidden="true"></i> Galéria</a> <a href="/" target="new"><i class="fa fa-share-square-o" aria-hidden="true"></i> IMDB</a> <a href="/" target="new"><i class="fa fa-folder-open" aria-hidden="true"></i> Hírek</a>
</div>
</div>

 

CSS kód

 

<style>
@import 'https://fonts.googleapis.com/css?family=Lato&subset=latin-ext';
.project {
margin:0 auto;
width:330px;
}
.project .project-links {
margin:5px 0 15px;
padding:0;
width:auto;
}
.title { /* cím */
font-family: 'Lato', sans-serif;
color: #fafafa !important;
font-size: 14px;
text-align:center;
text-transform: uppercase;
background:#A18288;
margin:0;
padding:5px;
}
.quote { /* szöveg */
font-family: 'Lato', sans-serif;
font-size: 12px;
text-align:justify;
color: #A18288 !important;
background:#fafafa;
line-height: 16px !important;
border: 1px solid #A18288;
margin:0;
padding:10px 20px;
}
.project .project-links .fa { /* ikonok */
margin-right:4px;
font-size:11px !important;
color:#8B6970 !important;
font-style: normal !important;
}
.project .project-links a, .project .project-links a:visited {
font-family: 'Lato', sans-serif;
font-size:10px;
font-weight:normal;
color:#A18288 !important;
text-align:center;
text-transform:uppercase;
letter-spacing: 1px;
width:24%;
background:#EBEBEB;
border-bottom: 1px solid #A18288;
display: inline-block;
}
.project .project-links a:hover {
font-family: 'Lato', sans-serif;
background:#fafafa !important;
color:#000000;
}
</style>

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

Hozzászólások