css按坐标取背景图示例代码

前端技术 2023/09/05 CSS
背景图：
 
效果：
 
代码：

复制代码
代码如下:

<style type=\"text/css\">
.spanicon {
width: 32px;
height: 32px;
background: url(http://img.blog.csdn.net/20130808153035296) no-repeat;
border: 0;
color: #464646;
line-height: 32px;
margin-top: 2px
}
td {
vertical-align: middle;
text-align: left
}
</style>
<body>
<table>
<tr>
<td class=\"spanicon\" style=\"background-position: 0px -0px;\"></td>
<td><a href=\"#\">test1</a></td>
</tr>
<tr>
<td class=\"spanicon\" style=\"background-position: 0px -32px;\"></td>
<td><a href=\"#\">test2</a></td>
</tr>
<tr>
<td class=\"spanicon\" style=\"background-position: 0px -64px;\"></td>
<td><a href=\"#\">test3</a></td>
</tr>
<tr>
<td class=\"spanicon\" style=\"background-position: 0px -96px;\"></td>
<td><a href=\"#\">test4</a></td>
</tr>
</table>
</body>

本文地址：https://www.stayed.cn/item/12110

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案