码迷,mamicode.com
首页 > Web开发 > 详细

CSS权威指南 - 浮动和定位

时间:2016-03-01 01:04:58      阅读:198      评论:0      收藏:0      [点我收藏+]

标签:

浮动和定位 - 浮动和定位

浮动和定位目的就是布局。先说说浮动。

浮动

CSS1首次提到浮动。从netscape1以来可以通过声明让图片浮动。比如<img src=”b2.jpg” align=”right”> ,让其他内容围绕该图像。浮动一词来自html2.0的扩展。

图片的align实际上就是图片的浮动效果。

之后,CSS中任何元素都可以浮动。

浮动就是尽可能地靠左/右

float的值 left right none inherit

浮动元素

浮动让文档从正常流中删除,还是会影响布局。

一个元素浮动,其他元素会环绕该元素。

浮动元素的外边距不会和其他元素的外边距合并,就是margin不merge。

浮动元素必须显式表示宽度,不然默认没有宽度。

浮动的详细

浮动元素的包含块就是最近的祖先元素的。

一个行内元素浮动后会变成块级元素。

---

浮动元素的边界不会超过包含块的内边界。

浮动元素的左(右)边界必须是之前元素的右(左)边界,除非之后出现的浮动元素在下面。(就是说,一个方向的浮动元素不会重叠)

左浮动和右浮动元素不会重叠。

一个浮动元素不会比父元素高。如果浮动元素在一个merge的margin里,那么浮动元素会和下面的元素会好像有一个块级元素。以免浮动元素跑到上面去。这条比较有趣。

浮动元素不会比之前的元素高。

浮动元素不能比包含它的行框高。比如一个段落中有一个img浮动,浮动的img只能和之前行框一样高。

浮动元素的不能超过包含元素。

浮动元素必须尽可能高。

左(右)尽可能左(右)

CSS权威指南 - 浮动和定位

标签:

原文地址:http://www.cnblogs.com/mize/p/5229447.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!