Lekerekített árnyékos közösségi ikonok
2013.07.04. 22:15
Demó:

HTML kód:
<a href="//fuckinway.gportal.hu/portal/fuckinway/image/gallery/1372272617_27.png" target="_blank"><img alt="" src="//fuckinway.gportal.hu/portal/fuckinway/image/gallery/1372272617_27.png" style="width: 64px; height: 64px;" /></a> <a href="//fuckinway.gportal.hu/portal/fuckinway/image/gallery/1372272618_05.png" target="_blank"><img alt="" src="//fuckinway.gportal.hu/portal/fuckinway/image/gallery/1372272618_05.png" style="width: 64px; height: 64px;" /></a> <a href="//fuckinway.gportal.hu/portal/fuckinway/image/gallery/1372272618_34.png" target="_blank"><img alt="" src="//fuckinway.gportal.hu/portal/fuckinway/image/gallery/1372272618_34.png" style="width: 64px; height: 64px;" /></a>
CSS kód:
<style type="text/css">
a img {
-webkit-box-shadow: 4px 4px 3px rgba(0, 0, 0, 0.75);
-moz-box-shadow: 4px 4px 3px rgba(0, 0, 0, 0.75);
box-shadow: 4px 4px 3px rgba(0, 0, 0, 0.75);
background: #ffffff;
-webkit-border-radius: 40px;
-moz-border-radius: 40px;
border-radius: 40px;
}
a img:hover {
-webkit-box-shadow: 4px 4px 3px rgba(0, 0, 0, 0.75);
-moz-box-shadow: 4px 4px 3px rgba(0, 0, 0, 0.75);
box-shadow: 4px 4px 3px rgba(0, 0, 0, 0.75);
background: #ffffff;
-webkit-border-radius: 40px;
-moz-border-radius: 40px;
border-radius: 40px;
}</style>
Ennek a css kódját magában is használhatod kép effektként. :)
|