css浮动(float)和清除浮动(clear)
最近学习了制作网页,下面将制作过程中用到的及我了解到的浮动与清除浮动的方法简单分享一下。
float是css样式中的定位属性,用来设置标签对象(如
标签、
等html标签)的浮动布局,浮动也就是我们所说标签对象浮动居左靠左(float:left)和浮动居右靠右(float:right)
浮动的特性
1.运用了float的元素只能横向浮动,不能纵向浮动。
2.浮动元素的后一个元素会围绕着浮动元素,与position的元素相比,浮动元素并不会遮盖后面元素。
3.浮动元素之前的元素不会受当前浮动元素的影响,如果你想让两个块状元素并排显示,必须要让两个块状元素都应用浮动float属性。
4.块级元素设置了浮动属性后就失去了独占一行的特性
5.行内元素设置了浮动属性后就可以设置宽高属性
清除浮动
清除浮动属性:
clear:left/right/both
清除浮动的方法:
1.在所有浮动元素之后添加一个块级元素,给块级元素设置清除浮动属性
2.给所有浮动元素的父元素添加
3.给浮动元素的父元素添加overflow:hidden;