怎么用css中background属性截图?

html-css015

怎么用css中background属性截图?,第1张

background-position属性分为x轴和y轴,也就是横坐标和纵坐标两个值:background-positionx和background-positiony。

对于一整张大图只需要截取其中一部分,你需要知道两点:

1.需要的那一部分图片的在整个大图中的位置 2.它的大小

然后就好办了,我举个小例子:

一张300px*300px的大图,我需要的部分大小是宽20px高50px,在整个图片的位置离上边是20px;左边是80px,然后可以写样式了:

div{

background-image:url(bjimg.jpg)/*背景图片的路径*/

background-position:-80px -20px/*背景图片的位置是距左80px;距上20像素*/

width:20px/*div的宽度*/

height:50px/*div的高度*/

}

希望对你有所帮助。

层级关系指向更明确些,如果不行就加!important

例如:

.picContainer img-hover{相应设置 width:150px}这样不行的话就用下行

.picContainer img-hover{相应设置 width:150px!important}

不是截取,是位移,坐标是从元素左上方开始算的,第一个0是左边0,第二个是上面0

0 0 就是不截取

0 20px 就是左边不动,上面往下移动背景图 20px

自己试试就明白了。