设为首页收藏本站
联系我们切换到宽版

 找回密码
 立即注册
金黑网络»首页 › 源码编程区 › 前端教程 › html5教程 › day2-4，清除浮动-额外标签法
返回列表 发新帖

day2-4，清除浮动-额外标签法

[复制链接]
admin 发表于 2025-5-18 18:21:05 | 显示全部楼层 |阅读模式
清除浮动-额外标签法
1.jpg

1.jpg
  1.   <title>清除浮动-额外标签法</title>
  2.   <style>
  3.     .father {
  4.       margin: 10px auto;
  5.       width: 1200px;
  6.       /* height: 300px; */
  7.       background-color: pink;
  8.     }

  10.     .left {
  11.       float: left;
  12.       width: 200px;
  13.       height: 300px;
  14.       background-color: skyblue;
  15.     }

  17.     .right {
  18.       float: right;
  19.       width: 950px;
  20.       height: 300px;
  21.       background-color: orange;
  22.     }

  24.     .bottom {
  25.       height: 100px;
  26.       background-color: brown;
  27.     }

  29.     .clearfix {
  30.       clear: both;
  31.     }
  32.   </style>
  33. </head>
  34. <body>
  35.   <div class="father">
  36.     <div class="left"></div>
  37.     <div class="right"></div>
  38.     <div class="clearfix"></div>
  39.   </div>
  40.   <div class="bottom"></div>
  41. </body>
复制代码
1.jpg


4.jpg

5.jpg

1.jpg
回复

举报

返回列表 发新帖

QQ|网站地图|Archiver|手机版|金黑网络 ( 粤ICP备2021124338号 )

网站建设，微信公众号小程序制作，商城系统开发，高端系统定制，app软件开发，智能物联网开发，直播带货系统等

Powered by Www.Jinhei.Cn

Copyright © 2013-2024 深圳市金黑网络技术有限公司 版权所有

快速回复 返回顶部 返回列表