CSS实例教程:定位(position)布局页面
作者 佚名技术
来源 CSS技术
浏览
发布时间 2012-02-27
| 的是，不清楚Position属性为absolute的板块，若想定位到父级板块中，并且当浏览器的大小改变或显示器的分辨率改变，布局不发生改变，是需要满足两个条件的，只要有一点不满足，元素就会以浏览器左上角为原点，从而导致页面布局错位。 【position:relative】 意思是相对定位，他是默认参照父级的原始点为原始点，无父级则以文本流的顺序在上一个元素的底部为原始点，配合TRBL进行定位，当父级内有padding等CSS属性时，当前级的原始点则参照父级内容区的原始点进行定位，有以下属性：
以上三点可以总结出，无论父级存在不存在，无论有没有TRBL，均是以父级的左上角进行定位，但是父级的Padding属性会对其影响。 综合上面对relative的叙述，我们就可以将position属性为relative的DIV视成可以用TRBL进行定位的的普通DIV，或者说只要将我们平时 布局页面的div的CSS属性中加上position:relative后，就不只是用float布局页面了，还可以用TRBL进行布局页面了，或者说加上 position:relative的DIV也可以像普通的DIV进行布局页面了，只不过还可以用TRBL进行布局页面。但是position属性为absolute不可以 用来布局页面，因为如果用来布局的话，所有的DIV都相对于浏览器的左上角定位了，所以只能用于将某个元素定位于属性为absolute的 元素的内部某个位置，这样我们就可以总结比较重要的结论 属性为relative的元素可以用来布局页面，属性为absolute的元素用来定位某元素在父级中的位置 既然属性为absolute的元素用来定位某元素在父级中位置，就少不了TRBL，这时候根据一开始讲的absolute的第三条，如果父级元素没有 position属性那么absolute元素就会脱离父级元素，但是如果是布局页面，父级元素position的属性又不能为absolute，不然就会以浏览 器左上角为原点了，所以父级元素的position属性只能为relative！ =========== |
凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢! |
你可能对下面的文章感兴趣
上一篇: CSS基础入门教程:理解盒子模型下一篇: CSS网页定位教程:详细学习定位知识
关于CSS实例教程:定位(position)布局页面的所有评论
