|
Elite csere 3
2019.06.12. 11:44
CSS kd:
.elitecsere { /* csere szekci */
margin: 0 auto !important;
text-align: center;
}
.elitecsere a img { /* kpek */
background-color: transparent !important;
-webkit-filter: none;
filter: none;
transition: all 0.4s ease-in-out;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
}
.elitecsere a img:hover { /* kpek ha rviszed az egeret */
opacity: 1;
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
}
a.cserek {
position: relative;
display: inline;
}
a.cserek span { /* szveg megjelense */
visibility: hidden;
opacity: .1;
filter: alpha(opacity=10);
bottom: 25px;
left: 50%;
margin-left: -28px;
z-index: 999;
position: absolute;
width: 55px; /* doboz szlessge */
color: #ffffff;
background: transparent;
text-align: center;
font-family: 'open Sans', sans-serif;
font-weight: bold;
font-size: 7pt !important;
text-transform: uppercase;
text-shadow: #000000 0px 3px 3px;
line-height: 8px !important;
transition: all 0.4s ease-in-out;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
}
a:hover.cserek span {
visibility: visible;
opacity: 1;
}
HTML kd:
<div class="elitecsere">
<a class="cserek" href="URL CM HELYE"><img alt="" src="KP URL CME" style="width: 55px; height: 70px; margin-left: 3px; margin-right: 3px; margin-top: 3px; margin-bottom: 3px;" /> <span>Te?</span></a>
<a class="cserek" href="URL CM HELYE"><img alt="" src="KP URL CME" style="width: 55px; height: 70px; margin-left: 3px; margin-right: 3px; margin-top: 3px; margin-bottom: 3px;" /> <span>Te?</span></a>
<a class="cserek" href="URL CM HELYE"><img alt="" src="KP URL CME" style="width: 55px; height: 70px; margin-left: 3px; margin-right: 3px; margin-top: 3px; margin-bottom: 3px;" /> <span>Te?</span></a>
<a class="cserek" href="URL CM HELYE"><img alt="" src="KP URL CME" style="width: 55px; height: 70px; margin-left: 3px; margin-right: 3px; margin-top: 3px; margin-bottom: 3px;" /> <span>Te?</span></a>
<a class="cserek" href="URL CM HELYE"><img alt="" src="KP URL CME" style="width: 55px; height: 70px; margin-left: 3px; margin-right: 3px; margin-top: 3px; margin-bottom: 3px;" /> <span>Te?</span></a><br />
<a class="cserek" href="URL CM HELYE"><img alt="" src="KP URL CME" style="width: 55px; height: 70px; margin-left: 3px; margin-right: 3px; margin-top: 3px; margin-bottom: 3px;" /> <span>Te?</span></a>
<a class="cserek" href="URL CM HELYE"><img alt="" src="KP URL CME" style="width: 55px; height: 70px; margin-left: 3px; margin-right: 3px; margin-top: 3px; margin-bottom: 3px;" /> <span>Te?</span></a>
<a class="cserek" href="URL CM HELYE"><img alt="" src="KP URL CME" style="width: 55px; height: 70px; margin-left: 3px; margin-right: 3px; margin-top: 3px; margin-bottom: 3px;" /> <span>Te?</span></a>
<a class="cserek" href="URL CM HELYE"><img alt="" src="KP URL CME" style="width: 55px; height: 70px; margin-left: 3px; margin-right: 3px; margin-top: 3px; margin-bottom: 3px;;" /> <span>Te?</span></a>
<a class="cserek" href="URL CM HELYE"><img alt="" src="KP URL CME" style="width: 55px; height: 70px; margin-left: 3px; margin-right: 3px; margin-top: 3px; margin-bottom: 3px;" /> <span>Te?</span></a></div>
<p>
| 
AJÁNLOM AZ OLDALT
