#edit_bar{
width:99%;
margin:5px 0px 0px 0px;
padding:3px 0px 0px 0px;
height:21px;
backgroud:url(../images/edit_bar.gif) no-repeat left 0;
}
#edit_bar li,#edit_bar li a {float:right; display:inline; width:74px; height:21px;outline:none;}
#edit_bar li a { width:auto; text-indent:-9999px; background:url(../images/edit_bar.gif) no-repeat left 0; }
#edit_bar .s01 a{ width:64px; }
#edit_bar .s01 a:hover{background-position:0px -21px; }
#edit_bar .s02 a{ width:64px; background-position:-72px 0px; }
#edit_bar .s02 a:hover{background-position:-72px -21px;}
#edit_bar .s03 a{ width:64px;background-position:-144px 0px;}
#edit_bar .s03 a:hover{background-position:-144px -21px; }
#edit_bar .s04 a{ width:64px;background-position:-216px 0;}
#edit_bar .s04 a:hover{background-position:-216px -21px; }
#edit_bar .s05 a{ width:64px;background-position:-288px 0;}
#edit_bar .s05 a:hover{background-position:-288px -21px; }
#edit_bar .s06 a{ width:64px;background-position:-360px 0;}
#edit_bar .s06 a:hover{background-position:-360px -21px; }
一组图片,通过控制显示位置来控制显示图片的大小,而不是用到的所有图片都找得到
而是一张图片,放所项目有的要用的图片
分享到:
相关推荐
CSS中背景background-position负值定位 CSS中背景background-position负值定位 CSS中背景background-position负值定位 CSS中背景background-position负值定位 CSS中背景background-position负值定位
批量输出 CSS background-position 属性的定位像素值
css 之 background-position-x
语法:background-position : length || length background-position : position || position 取值:length : 百分数 | 由浮点数字和单位标识符组成的长度值。请参阅 长度单位 position : top | center | ...
CSS中背景图片定位方法:background-position的用法,附带算法
这篇文章将会涉及css背景(background)的基本用法,包括诸如 background-attachment 等的属性,也会介绍一些有关背景(background)的常用技巧,以及 css3 中的 背景(background)(包含4个新的背景(background)属性)。...
<style type="text/css"> body { margin:0; padding:0; font: bold 11px/1.5em Verdana; } h2 { font: bold 14px Verdana, Arial, Helvetica, sans-serif; color: #000; margin: 0px; padding: 0px 0px 0px...
background background-attachment background-color background-image background-position background-positionX background-positionY background-repeat layer-background-color layer-background-image ...
PostCSS双位置渐变 允许您遵循规范在CSS中使用双位置渐变。 .linear-gradient { background-image : linear-gradient ( 90 deg , black 25 P % , blue 50 u % ); } .conic-gradient { background-image : conic-...
设置或检索对象的背景图像位置。必须先指定 background-image 属性。该属性定位不受对象的补丁属性( padding )设置影响
background: url(css-face.gif) no-repeat; } #face li#face1 { background-position:-22px -5px; } #face li#face2 { background-position:-104px -5px; } #face li#face3 { background-position:-185px ...
百思不得其解,后来发现CSS 这样定义: 复制代码代码如下: .nav { background:transparent url(images/y.gif) no-repeat scroll 0 0; height:42px; width:980px; font-size:12px; list-style:none; } .nav ul{ ...
positionz-indextoprightbottomleft 尺寸 Dimensions heightmax-heightmin-heightwidthmax-widthmin-width 布局 Layout clearfloatclipoverflowoverflow-xoverflow-ydisplayvisibility 外补丁 Margins ...
background-position background-repeat background-attachment background-origin //css3新增属性 background-clip //css3新增属性 background-size //css3新增属性 描述 说明 (css3多重背景属性) 设置多重背景...
背景图效果,还附有以使用精灵图的方式解决网站中的小图标问题,这种办法相比较之前的方法,稍微有点类似,主要用到background-position属性外,还需...
background-position鱼游动特效是一款基于css3 animation transform属性制作两条游动的鲨鱼动画特效。
一个div同时设置background-color和...css: .wrap{ position: relative; background: url(i/pic4.jpg) no-repeat; -webkit-background-size: 100%; background-size: 100%; } .warp-mask{ height:100%;