div高度为0解决

         div高度是根据里面内容自适应撑开的,如果没有内容高度则为0;但div里面有内容高度仍是0,多半是因为元素浮动引起,div里面的元素浮动到其它地方,div里实际上没有内容,因而为0;

        用如下为例: 

<div>
  <a> <img></img></a>
</div>

         显示图片后,div高度可能为0,此时可以通过如下3种方式解决掉高度为0:

     1. 使用overflow属性:

           为div增加样式:

style="overflow:visible"

          这样即可撑满div,overflow可以取值:auto 出现滚动条;hidden:超过范围的隐藏(文字会显示不全)

   2. 增加div清除浮动:

       在被包含的元素下面,此例中为<a></a>下面增加:

<div class="clear"></div>

 清除浮动后,<a></a>将落入div中,不再浮动。

   3. 使用伪类after:

      为div增加样式:

      

/*利用:after伪元素*/ 
div:after { 
content:""; 
display: block; 
clear: both; 
} 

 

其它文章参考:

http://www.jb51.net/css/74450.html

猜你喜欢

转载自halfsking.iteye.com/blog/2330562
今日推荐