您的位置：首页 > Web前端 > CSS

CSS学习笔记一如何清除浮动

2015-10-30 12:01 681 查看

<!<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1,maximun-scale=1,user-scalable=no">
<!--清除浮动
方法一：　.divcss5{border:1px solid #F00;background:#FF0;width:400px;}产生浮动
.divcss5{border:1px solid #F00;background:#FF0;width:400px;height:102px;}清除浮动，给父级加高度：是子级内容+边框的高度。

方法二：
.clear{clear:both;}
<div class="clear"></div>

方法三：.divcss5{border:1px solid #F00;background:#FF0;width:400px;overflow:hidden} 建议使用overflow:hidden，使父级紧贴其对象内容
-->
<style>
.divcss5{border:1px solid #F00;background:#FF0;width:400px;}
.divcss5-left,.divcss5-right{border:1px solid #00F;background:#FFF;width:180px;height:100px;}
.divcss5-left{float:left;}
.divcss5-right{float:right;}

</style>
</head>
<body>
<div class="divcss5">
<div class="divcss5-left"></div>
<div class="divcss5-right"></div>
</div>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航

CSS学习笔记一 如何清除浮动

CSS学习笔记一如何清除浮动