Div 高度为 0 解决方法

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

用如下为例: 

<div>
  <a><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:

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


4. 设置 Div overflow:hidden


参考:

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

https://blog.csdn.net/halfsking/article/details/84821459


声明:本站所有文章和图片,如无特殊说明,均为原创发布。商业转载请联系作者获得授权,非商业转载请注明出处。
真诚赞赏,手留余香
赞赏
随机推荐
阿里云内容安全 API 签名机制
如何使用 Photoshop 绘画像素风格图片
JavaScript 中 0.1 加 0.2 不等于 0.3 的原因和解决方法
WordPress 支持事务
Debian11 安装笔记2:编译安装PHP
WordPress 语言文件
WordPress 添加文章自定义字段 meta
WP_Query 函数