经验首页 前端设计 程序设计 Java相关 移动开发 数据库/运维 软件/图像 大数据/云计算 其他经验
当前位置：技术经验 » HTML/CSS » HTML5 » 查看文章
清除浮动
来源：cnblogs　　作者：C_XingM　　时间：2019/7/17 10:51:04　　对本文有异议

CSS样式中有浮动的情况下，一般都不希望正常的文档流显示的内容被盖住，所以有浮动的情况下，会紧跟着后面加一个div清除浮动。

  1. .clear{
  2.             width: 0px;
  3.             height: 0px;
  4.             clear:both;
  5.         }

　　

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>清除浮动</title>
  6.     <style type="text/css">
  7.         .div1{
  8.             width: 200px;
  9.             height: 200px;
  10.             background-color: green;
  11.             float: left;
  12.         }
  13.         .div2{
  14.             width: 200px;
  15.             height: 200px;
  16.             background-color: red;
  17.             float: left;
  18.         }
  19.         .div3{
  20.             width: 500px;
  21.             height: 500px;
  22.             background-color: gray;
  23.         }
  24.         .clear{
  25.             width: 0px;
  26.             height: 0px;
  27.             clear:both;
  28.         }
  29.     </style>
  30. </head>
  31. <body>
  32.     <div class="div1"></div>
  33.     <div class="div2"></div>
  34.     <div class="clear"></div>
  35.     <div class="div3"></div>
  36. </body>
  37. </html>

　　

原文链接：http://www.cnblogs.com/Caixingmin/p/11192320.html

 友情链接：直通硅谷 　点职佳 　北美留学生论坛

HTML5热门文章

  • Webpack友好的错误提示插件friendly-errors-webpack-plugin
  • uni-app 微信小程序 picker 三级联动
  • 记录vue用 html5+做移动APP 用barcode做扫一扫功能时安卓 的bug(黑屏、错位等等)和解决方法
  • H5+ 操作手机日历
  • uni-app开发经验分享十五： uni-app 蓝牙打印功能
  • 设计中的设计PDF下载高清完整扫描原版
  • 前端canvas动画如何转成mp4视频的方法
  • antd通过 filterDropdown 自定义--按某天时间搜索
  • H5+ API 设置手机状态栏颜色以及沉浸式状态栏
  • elementui中el-input联想搜索框

    • HTML5推荐文章

  • canvas实现动态替换人物的背景颜色
  • form 表单恢复初始数据
  • canvas?中如何实现物体的框选
  • 前端canvas中物体边框和控制点的实现示例
  • FileReader()读取文件、图片上传预览
  • 跨域访问方法介绍(5)--使用 window.postMessage 传递数据
  • 跨域访问方法介绍(3)--使用片段识别符传值
  • 跨域访问方法介绍(4)--使用 window.name 传值
  • HTML
  • 前端常用模板引擎- artTemplate

    • 本站QQ群：前端 618073944 | Java 606181507 | Python 626812652 | C/C++ 612253063 | 微信 634508462 | 苹果 692586424 | C#/.net 182808419 | PHP 305140648 | 运维 608723728

    W3xue 的所有内容仅供测试，对任何法律问题及风险不承担任何责任。通过使用本站内容随之而来的风险与本站无关。
    关于我们  |  意见建议  |  捐助我们  |  报错有奖  |  广告合作、友情链接（目前9元/月）请联系QQ：27243702 沸活量
    皖ICP备17017327号-2　皖公网安备34020702000426号