 

为什么 CSS 样式下两张图片不显示，left 样式没有宽度，虽然父元素有宽度，但只有 30% 子元素有宽度？-css教程-

2025-03-26 20:15:43 浏览量(26)

为什么 css 样式下两张图片不显示，left 样式没有宽度，虽然父元素有宽度，但只有 30% 子元素有宽度？

css 一个样式问题

问题：

这段代码中，两张图片不显示，且 left 样式没有宽度，尽管父级有宽度，并且子级的 30% 没有。请问是什么问题？

<div class="store-info">
  <div class="left">
    @@##@@
  </div>
  <div class="right">
    ...
  </div>
</div>

登录后复制

.store-info {
  display: flex;
  height: 100px;
  padding: 10px;
  background-color: #fff;
  border-radius: 10px;
  .left {
    width: 30%;
    height: 100%;
    overflow: hidden;
    border-radius: 10px;
    margin-right: 10px;
    .left-img {
      display: flex;
      width: 100%;
      height: 100%;
    }
  }
  .right {
    flex: 70%;
    ...
  }
}

登录后复制

解答：

立即学习“前端免费学习笔记（深入）”；

猜测问题可能出在 flex 使用不当。请提供 right 的样式，以便进一步排查。

以上就是为什么 CSS 样式下两张图片不显示，left 样式没有宽度，虽然父元素有宽度，但只有 30% 子元素有宽度？的详细内容，更多请关注php中文网其它相关文章！

【声明】：本博客不参与任何交易，也非中介，仅记录个人感兴趣的主机测评结果和优惠活动，内容均不作直接、间接、法定、约定的保证。访问本博客请务必遵守有关互联网的相关法律、规定与规则。一旦您访问本博客，即表示您已经知晓并接受了此声明通告。

分享到