CSS中背景background-position负值定位深入理解

作者: 来源:http://www.xgdown.com/ 时间:2007-8-29 8:12:30

CSS中背景background-position负值定位深入理解(2)
　　HTML页中是162*162的灰色背景DIV块并加入三种不同位置的背景图片，
　　在浏览器中看到的效果：

　　从上图可以看到：当为background-position:0 0;时图片的左上角与DIV的左上角是重合的，当我们定位于background-position:-50px -50px;时发现图片向左、上移动了，也就以DIV的左上角为中心，图向左移动了50PX，向上也移动了50PX．第三个示例采用的都是正值，可以解解释为图向右、向下移动的效果．这个应该是好理解的．
　　总结一下就是以上都是以DIV的0，0点为参考点图片移动，如果把DIV区解释为一个坐标轴图，向左，上都为负，向右，下为正值．

　　好象说这么多你也记不住，那我就告诉你，你应该记住什么吧！

　　在实践中多数情况是知道一个图的位置要如上图中那个黄色的点，我们应该在效果图上量出它的长度得出两个值都是150PX,那我们定义图的位置就要写background-position:-150px -150px;这样就定义好了,在图上的量法就看下图（这张图相当于你用的效果图或称设计图），记住这张图相信你一定能掌握背景图负值的方法了。

1.CSS中背景background-position负值定位深入理解(1)
2.CSS中背景background-position负值定位深入理解(2)

共2页 9 7 [1] [2] 8 :>

CSS中背景background-position负值定位深入理解相关文章：

·用纯CSS样式实现的网页中圆角矩形代码
·CSS中背景background-position负值定位深入理解
·总结：IE6不支持的CSS选择符
·用CSS制作的很不错的简洁的网页导航下拉菜单
·Web标准学习：CSS样式书写风格
·CSS常用小技巧大总结
·网页中用CSS样式表隐藏文字的挺新颖方法
·CSS实现的网页中文字排版的几种方式
·浏览器Firefox与IE在CSS样式表中的差异
·CSS教程:block element与inline element元素详解

CSS中背景background-position负值定位深入理解相关软件：

·Any Background V1.1.1 汉化版
·DVD Region+CSS Free V5.12 汉化版
·Backgrounder (文件夹添加背景) V1.5 绿色汉化版
·CSS Tab Designer ( 快速css导航栏生成) V2.0.0 绿色汉化版 CSS Tab Designer ( 快速css导航栏生成) V2.0.0 绿色汉化版
·CSS2.0手册 (苏沈小雨版)
·CSS层叠样式表手册

特别声明：本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载，但请务必注明出处和原始作者。文章版权归文章原始作者所有。对于被本站转载文章的个人和网站，我们表示深深的谢意。如果本站转载的文章有版权问题请联系编辑人员，我们尽快予以更正。
转载请注明来源：http://www.xgdown.com