当前位置: 首页 > news >正文

关于清除浮动

浮动最早是用来做图文排版,为了让块级元素同行显示,而html中块元素是有自己的排列规则,一般独占一行。

所以有了浮动元素,一旦元素浮动了就会脱离文档流,产生问题。

怎么去清除浮动:

(1)给受到浮动元素影响的元素添加overflow:hidden; 因为overflow属性会触发BFC

【BFC:block formatting context块级格式化上下文-让元素强制按照块级元素的规则进行排序】

(2)在受到浮动影响的元素前面,添加一个空的div,给空的div添加样式:clear:both

(3)在浮动元素的父标签的伪元素选择器:after中取出浮动—类似于空div

//伪元素是行内元素,正常浏览器清除浮动

.x:after{

content:””,

display:block,

clear:both;

}

(4)在最后一个元素加上clear:both

(5).xxxx{

*zoom:1;

}

http://www.lryc.cn/news/43933.html

相关文章:

  • Uber H3 index 地图索引思考
  • 多线程的几种状态
  • 【算法题】1574. 删除最短的子数组使剩余数组有序
  • 理解对数——金融问题中的自然对数(以e为底的对数)
  • vue2进阶学习之路
  • 决策树ID3算法
  • C++模板基础(一)
  • 生产者消费者模型线程池(纯代码)
  • K8s 应用的网络可观测性: Cilium VS DeepFlow
  • 3.29面试题
  • 操作系统漏洞发现
  • Linux gdb调试底层原理
  • LC-1647. 字符频次唯一的最小删除次数(哈希+计数)
  • HTTP状态码
  • 【Linux】初见“which命令”,“find命令”以及linux执行命令优先级
  • update case when 多字段,多条件, mysql中case when用法
  • mysql隐式转换 “undefined“字符串匹配到mysql int类型0值字段
  • Redis八股文
  • InnoDB——详细解释锁的应用,一致性读,自增长与外键
  • C++模板基础(四)
  • pycharm使用记录
  • Linux命令·kill·killall
  • Linux /proc/version 文件解析
  • 【Django 网页Web开发】15. 实战项目:管理员增删改查,md5密码和密码重置(08)(保姆级图文)
  • STL容器之<array>
  • flask教程6:cookie和session
  • 【JavaEE初阶】第六节.网络原理TCP/IP协议
  • 模式识别 —— 第六章 支持向量机(SVM)与核(Kernel)
  • 总结 synchronized
  • 360周鸿祎又“开炮”:GPT 6-8就将产生自主意识!我们来测算一下对错