EasyShop/_include/css/social-icons.css

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

/* Social Links
=================================================================== */

[class^="social-"],
[class*="social-"] {
	display: inline-block;
	width: 40px;
	height: 40px;
	border: 1px solid #444;
	*margin-right: .3em;
	line-height: 40px;
	margin-right: 8px;
	vertical-align: text-top;
	background-image: url("../img/icons/social-icons-set.png");
	background-position: 40px 40px;
	background-repeat: no-repeat;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

/* Retina Display Hack */

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
	
	[class^="social-"],
	[class*="social-"] {
		display: inline-block;
		width: 40px;
		height: 40px;
		line-height: 40px;
		vertical-align: text-top;
		background-image: url("../img/icons/social-icons-set@2x.png");
		background-position: 40px 40px;
		background-repeat: no-repeat;
		background-size: 400px 320px;
	}	 
    
}

.social-forrst {
	background-position: -0px -0px;
}

.social-forrst:hover {
	background-position: -0px -40px;
	background-color: #5b9a68;
}

.social-dribbble {
	background-position: -40px -0px;
}

.social-dribbble:hover {
	background-position: -40px -40px;
	background-color: #ef5b92;
}