清除浮动

简介: 清除浮动。

清除浮动
(1)清除浮动的基本语法格式
选择器{clear:属性值;}
(2)clear常用的属性值
left:不允许左侧有浮动标签(清除左侧浮动的影响)。
right:不允许右侧有浮动标签(清除右侧浮动的影响)。
both:同时清除左右两侧浮动的影响。
(3)使用空标签清除浮动
在浮动元素之后添加空标签,并对该空标签应用“clear:both;”样式,可清除元素浮动所产生的影响
(4)使用overflow属性清除浮动
浮动元素的父元素添加overflow:hidden;也可以清除浮动。
(5)使用after伪对象清除浮动
必须为需要清除浮动的元素伪对象设置“height:0;”样式,否则该元素会比其实际高度高出若干像素。
必须在伪对象中设置content属性,属性值可以为空,如“content: "";”。

相关文章
|
2月前
清除浮动
清除浮动。
27 0
|
前端开发 搜索推荐 容器
伪元素的应用
伪元素的应用
伪元素的应用
|
人工智能 前端开发 图形学
CSS基础浮动和清除浮动的分享
CSS的定位机制有3种: 标准文档流、浮动和定位。 标准文档流实际上就是一个网页内标签元素正常从上到下,从左到右排列顺序的意思,比如块级元素会独占一行,行内元素会按顺序依次前后排列。浮动(float) 浮动是个很有意思的事情:就是让任何盒子可以一行排列。
80 1
CSS基础浮动和清除浮动的分享
|
前端开发 容器
【清除浮动的 5 种方法】
【清除浮动的 5 种方法】
|
编解码 人工智能 前端开发
CSS中的绝对定位和相对定位
CSS中的绝对定位和相对定位
|
前端开发
CSS的相对定位和绝对定位到底有什么不同?
CSS的相对定位和绝对定位到底有什么不同?
200 0
CSS的相对定位和绝对定位到底有什么不同?
|
前端开发 开发者
浮动与清除浮动| 学习笔记
快速学习浮动与清除浮动。
152 0
浮动与清除浮动| 学习笔记
如何清除浮动的四种方法
清除浮动的四种方法
101 0