css背景图定位截取

html-css012

css背景图定位截取,第1张

要调整背景图的渲染尺寸,需要用到background-size这个样式规则,但这是CSS3新增的,所以目前暂时没有全兼容的解决方案。

哦,这个意思,那么如果你贴背景图的容器高度与背景图那几个logo一致,就采用纵向排列图片,垂直定位的方式;如果容器宽高都比logo尺寸大,那就没办法了,再嵌入一个小容器专门显示这个图标吧。

用CSS的背景定位就OK了。

比如 background:url(../images/ico.png) no-repeat -20px -100px

如果ico.png就是你给的这张图的话,那么这个背景图片的显示位置就是从这张图的横坐标左移20px.纵坐标上移100px处开始。知道这个原理了我想你应该知道怎么弄了吧。

比如你的一个按钮要用到图中的某个按钮,你只要通过切图软件知道该按钮的宽和高,然后知道该按钮距离左边界有多远,距离上边距是多少。这样就能通过定位来实现了。。

background:

图片链接 url(../img/site_bg.gif)

图片定位(由图片的左上角开始计算) -100px -100px

不重复图片 no-repeat

再加上尺寸:width:100pxheight:100px