码迷,mamicode.com
首页 > Web开发 > 详细

HTML--高度塌陷(css)几种小技巧

时间:2018-08-22 17:04:54      阅读:216      评论:0      收藏:0      [点我收藏+]

标签:lin   nbsp   div   oom   方法   overflow   val   标签   属性   

解决办法

1.在高度塌陷的父div里面加一个div:

<div id="a">

<div id="a1">

</div> <div id="a2">

</div>

<div style="clear: both;"></div>//加一个标签,清除浮动

</div>

优点:适合初学者,兼容性 强。 
缺点:代码不简练,不利于优化。

2.overflow + zoom方法

#a{ background: red;

/*第二种方法*/

overflow: hidden;

zoom:1; }

优点:兼容性强。 
缺点:对margin属性会有影响,不能设负值,会被裁掉。负值绝对定位也不可以。

3.after + zoom方法(绝杀)

#a{ background: red; zoom:1; }

#a:after{ display: block;

content: ‘.‘;

clear:both;

line-height: 0;

visibility: hidden; }

优点:通用,兼容性强 
缺点:不好记。

HTML--高度塌陷(css)几种小技巧

标签:lin   nbsp   div   oom   方法   overflow   val   标签   属性   

原文地址:https://www.cnblogs.com/sueing/p/9517869.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!