1.background-position:表示背景定位的属性。描述属性值时,有两种方式:一是像素描述;而是单位描述。 (1)像素描述: 格式如下: 属性值可以是正数,也可以是负数。比如:100px 200px、-50px -120px。 举例如下: (2)单词描述 ...
上篇文章讲到了雪碧图,其中小机器人抖腿的动作设置了图片的background position: px 循环到 px,那么这个数值是如何得出来的 下面具体分析一下如何计算background position的数值。 分析素材 下面这张雪碧图是今天的分析素材,尺寸为 ,单位是px: 概念 background position:设置背景图像的起始位置。 实验分析 html代码:设置一个box用于显 ...
2018-03-08 10:53 0 1792 推荐指数:
1.background-position:表示背景定位的属性。描述属性值时,有两种方式:一是像素描述;而是单位描述。 (1)像素描述: 格式如下: 属性值可以是正数,也可以是负数。比如:100px 200px、-50px -120px。 举例如下: (2)单词描述 ...
1、background-position:0 0;等于background-position:left top;(左上角) 2、background-position:100% 100%;等于background-position:right bottom;(右下角 ...
相信很多喜欢研究网页界面的童鞋都遇到过一个奇妙的现象:网页中很多图片素材被合成在一张图片上。 起初小菜模仿网站的时候,经常遇到这个现象,那时候也不知道这时什么技术,人家的整张图片素材不 ...
background-position详细用法 background-position的值有三种表示方法,分别有不同的含义: 1)百分比 (容器的内容宽度-背景图片的宽度)*对应的百分比 即为图片要移动的距离 如果您仅规定了一个值,另一个值将是 50%。 2)长度 ...
这是一个有趣的话题 其实我并不确切的平时大家是怎么去应用或者玩转一个属性,一个值。我能肯定的是这些东西都有不少的可玩性。 我今天要聊的 background-position 应该已经被大家玩得色彩斑斓了。尤其是 CSS Sprites流行的这些年,background-position ...
一.background-position:left top; 背景图片的左上角和容器(container)的左上角对齐,超出的部分隐藏。等同于 background-position:0,0;也等同于background-position ...
一.background-position:left top; 背景图片的左上角和容器(container)的左上角对齐,超出的部分隐藏。等同于 background-position:0,0;也等同于background-position ...
看到了几篇文章,总结下先: 1. background-position是依赖于no-repeat的,在repeat的状态下和默认的状态下(默认即为repeat),background-position是不起作用的。 2. 其余的尚好理解,主要说一下百分比 ...