Az ikonokhoz ezt a kódot is másoljátok ki:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
Az ikonokat itt tudjátok módosítani: https://fortawesome.github.io/Font-Awesome/icons/
Doboz kódja
<div class="project" style="background:url(/images/scripts/szovegdobozok/025/001.jpg); left top no-repeat; background-size:cover;"><div class="details">Gilmore girls | 2016<br />
<small><a href="/"><strike class="fa fa-picture-o"></strike></a> <a href="/"><strike class="fa fa-info-circle"></strike></a> <a href="/"><strike class="fa fa-facebook-official"></strike></a></small></div>
</div>
CSS kód
<style type="text/css">
.project {
margin:0 auto 10px;
padding:0;
width:auto;
height:150px;
max-width:340px;
overflow:hidden;
text-align:left;
position:relative;
color: #ffffff;
font-family: Century Gothic;
font-size: 12px;
font-weight: bold;
line-height: 20px;
opacity:0.6;
filter: alpha(opacity=60);
-moz-opacity: 0.6;
}
.project .details {
position:absolute;
top:90px;
left:6px;
z-index:100;
background: #000000;
border: 1px solid #ffffff;
padding: 5px;
}
.project small {
font-weight: 300;
color: #bbb;
}
.project a {
color: #ffffff;
font-size: 15px;
}
.project a:hover {
color: #A48377;
}
strike {
text-decoration: none;
}
</style>
2 500 megtekintés