CSS从大图片上截取小图标的操作

注：图片名称（tabicons.png）每个小图标width:18px;height:18px从左上角坐标为（-0px;-0px;）;

例如第一个对号的坐标为(-0px;-0px;)第二个加号的图标为(-20px;-0px;)中间依次加20个像素

截取小图标样式

.icon

{

    background: url(imges/tabicons.png) no-repeat;

    width: 18px;

    line-height: 18px;

    display: inline-block;

}

.icon-set

{

 background-position: -380px -200px;

}

.icon-add

{

 background-position: -20px 0px;

}

 样式调用示例

<form id="form1" runat="server">

    <div class="icon icon-add">

        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div>

    </form>

巴特西

CSS从大图片上截取小图标的操作

最新文章

热门文章