浮动的用法

Posted 2020-09-27

浮动的代码书写及用法
float:left;    左浮；
float：right;    右浮；
在编写网页时，我们可以把网页当成是一个大块，这个大块由很多小块组成。只需要把网页的每一小块的父级找准，将相应的内容和样式写进对应的模块中，就可以利用浮动将模块放在网页的相应的位置。
在使用浮动时需要注意：
1、子级浮动会导致父级的高度坍塌，若要找回高度，则需触发BFC（overflow:hidden)，块级格式上下文；
2、行内元素设置浮动，会自动转为块级元素，可以设置宽高；
3、浮动文本类的标记，如果没有指定宽度，浮动后会自动折叠到最小宽度；
4、子级浮动始终在父级包含块内部，不会穿越到padding区域；
5、若父级包含包含块没有足够空间容纳子元素浮动，子级会自动换行，而不会覆盖前一个元素。
6、浮动会影响其他元素，若需要清除浮动对自身的影响，可以使用clear：lift/right/both。