CSS背景位置背景图像坐标设置

CSS背景图片背景坐标设置，代码示例:

background:url(images/xx.gif) no-repeat 0 -66px;}

下图显示了背面图像的左上角相对于当前元素的左上角的坐标. 右侧是X轴的正半轴图片坐标识别，而底部是Y轴的正半轴. 当前元素左上角的坐标为0. 0默认图片的左上角与当前元素的左上角直接相对: 如果图片要向左移动10px:

background:url(images/hh.gif) no-repeat -10px 0;}

如果图片要向上移动10像素:

background:url(images/hh.gif) no-repeat 0 -10px;}

CSS背景图像坐标设置示例:

background:transparent url(/images/***.png" target="_blank" >

1，0 -152px不重复；

2，右上方无重复；

3，0 -256px不重复；

4，0 -222px不重复；

5，0 -294px repeat-x;

6，0 -188px repeat-x;

7，-42px -222px不重复；

8，-42px -249px不重复；

9，重复-x滚动0 -188px;

打扰: 根据上图，背景图片是9个区域中的哪个？

分析结果如下:

根据您需要使用的图标，最大高度为36px，最大宽度为107px. 并且由于您提供的值，以下内容包括no-repeat和repeat-x;即，装饰图是否重复. 您可以分析图片中需要重复的图标类型.

图片中的复选标记是重复图标. 值前面的数字1、2、3是您提供的数字的序列号

对于第九个重复-x: 滚动0-188px；滚动基本上是无用的. 如果重复-y，它仍然有用. 当然图片坐标识别，如果要花这么少的时间，建议使用特殊的背景定位软件来生成CSS样式: css sprites.

本文来自电脑杂谈，转载请注明本文网址：
http://www.pc-fly.com/a/tongxinshuyu/article-157462-1.html