DIV+CSS定位之相对定位与绝对定位_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 12:28:50
Original
1127 people have browsed it

CSS控制排版过程中,经常一不小心就被搞得版面乱七八糟.其实只要弄清楚各个方法的含义即可

语法
position : static | absolute | fixed | relative

它们分别是静态(static),绝对定位(absolute),固定(fixed),相对定位(relative)

比较常用的是absolute和relative

绝对定位(absolute):将被赋予此定位方法的对象从文档流中拖出,使用left,right,top, bottom等属性相对于其最接近的一个最有定位设置的父级对象进行绝对定位,如果对象的父级没有设置定位属性,即还是遵循HTML定位规则的,则依据 body 对象左上角作为参考进行定位。绝对定位对象可层叠,层叠顺序可通过 z-index 属性控制,z-index值为无单位的整数,大的在最上面,可以有负值(目前负值FF不支持)。

相对定位(relative):对象不可层叠,依据left,right,top,bottom等属性在正常文档流中偏移自身位置。同样可以用z-index分层设计。

absolute脱离原来父级对象后,其位置会被其它对象填补,而relative则不会

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!