html – 强制div具有背景图像的大小

概述在Div上使用背景图像时,我无法显示图像的整个高度,也没有使用高度：自动;或身高：100％.为什么这样？ 我该如何解决这个问题？ 我在这里创建了一个JS小提琴：https://jsfiddle.net/2d0npz2v/5/ body, html { height: 100%; margin: 0px;}.imageContainer2 { background-image: ur 在div上使用背景图像时,我无法显示图像的整个高度,也没有使用高度：自动;或身高：100％.为什么这样？
我该如何解决这个问题？

我在这里创建了一个Js小提琴：https://jsfiddle.net/2d0npz2v/5/

body,HTML {  height: 100%;  margin: 0px;}.imageContainer2 {  background-image: url("http://i.imgur.com/AWi7r5m.jpg");  background-@R_301_4612@: center top;  background-size: 100% auto;  height: 100%;}

<div ></div>

UPDATE
为清楚起见,图像需要100％宽度和自动高度(不在底部切割).
此示例有效,但它使用“content”属性而不是“background-image”：https://jsfiddle.net/j47a6x7s/.我正在寻找相同的行为但不使用内容.

解决方法 那么,这是为什么呢？

在您的工作示例中,您使用内容.内容具有自己的高度并占用空间,页面上的其他元素必须尊重空间.

使用背景图像解决方案,您可以使用不使用空间的背景. .imageContainer2元素无法知道背景图像的高度并使其自身适应它.

这个问题在这里得到解决：How to get div height to auto-adjust to background size?如果解决方法适合您,请检查一下

总结

以上是内存溢出为你收集整理的html – 强制div具有背景图像的大小全部内容，希望文章能够帮你解决html – 强制div具有背景图像的大小所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。