CSS定位帮助（sprite）
|
我在这里创建了一个小提琴：
http://jsfiddle.net/ozzy/77dJz/
不知何故（请注意，它的凌晨4:30）我已经对Facebook链接产生了悬停效果。
Twitter可以运作...只是不确定我做错了什么。
任何帮助表示赞赏，我很累大声笑。
要迭代：
CSS：
#facebook {
background:url(\'../images/socialsprite.png\') no-repeat scroll 0px 0px transparent;
height:40px;
width:180px;
margin-left:10px;
margin-top:30px;
}
#facebook:hover {
background:url(\'../images/socialsprite.png\') no-repeat scroll 0px -40px transparent;
height:40px;
width:180px;
}
#twitter {
background:url(\'../images/socialsprite.png\') no-repeat scroll -180px 0px transparent;
height:40px;
width:180px;
margin-left:210px;
margin-top:-40px;
}
#twitter:hover {
background:url(\'../images/socialsprite.png\') no-repeat scroll -180px -40px transparent;
height:40px;
width:180px;
}
没有找到相关结果
已邀请:
2 个回复
爆刺疤灯
2ѭ，这样它们就不会互相覆盖。 这是一些简化的CSS。根据需要编辑ѭ3。#facebook { background:url(\'http://sitehelp.com.au/images/socialsprite.png\') no-repeat scroll 0px 0px transparent; height:40px; width:180px; float:left; margin:25px 10px; } #facebook:hover { background:url(\'http://sitehelp.com.au/images/socialsprite.png\') no-repeat scroll 0px -40px transparent; } #twitter { background:url(\'http://sitehelp.com.au/images/socialsprite.png\') no-repeat scroll -180px 0px transparent; height:40px; width:180px; float:right; margin:25px 10px; } #twitter:hover { background:url(\'http://sitehelp.com.au/images/socialsprite.png\') no-repeat scroll -180px -40px transparent; }#facebook, #twitter { background:url(\'http://sitehelp.com.au/images/socialsprite.png\') no-repeat scroll transparent; height:40px; width:180px; float:left; margin:25px 10px; } #facebook:hover { background-position:0px -40px; } #twitter { background-position:-180px 0px; float:right; } #twitter:hover { background-position: -180px -40px; }薄扩络拜
覆盖了FacebookFacebook6ѭ。 只需删除Twitter，即可使您的Facebook重新工作... 如果要并排放置，则需要将它们浮动。 这正在工作... http://jsfiddle.net/77dJz/2/