学校网站风格,建设企业网站用动态还是静态,保定网站推广,济南网站建设公司-远大云.#x1f353;浮动属性
属性名称中文注释备注float设置盒子浮动left左浮动#xff0c;right右浮动#xff0c;none不浮动clear清除浮动left清除左浮动#xff0c;right清除右浮动#xff0c;both左右浮动都清除#xff08;注意#xff1a;clear清除浮动一般只有作用在块…浮动属性
属性名称中文注释备注float设置盒子浮动left左浮动right右浮动none不浮动clear清除浮动left清除左浮动right清除右浮动both左右浮动都清除注意clear清除浮动一般只有作用在块级元素上才能起作用
浮动的特点
浮动后的盒子脱离标准流并且可以在一行显示浮动可以将一个行内元素转换为块元素
清除浮动
⭐方法一让因为被浮动影响的盒子自己去处理clear: both;⭐方法二在浮动盒子的同级最后加一个没有宽高的盒子设置清除浮动div styleclear:both/div⭐方法三伪元素选择器清除浮动.container::after {content: ;display: block;clear: both;width: 0;height: 0;visibility: hidden;overflow: hidden;
}不成文的规定为了防止content内容显示出来一般会设置以下属性width: 0;height: 0;visibility: hidden;overflow: hidden;⭐方法四BFC清除浮动。overflow: hidden;作用于浮动盒子的父盒子可以触发BFC从而使得浮动盒子计算宽高
