Html 为什么不是'；这个div是否在表单元格中显示背景图像？

为什么

.col根本不显示bg图像


我刚刚意识到它没有显示，因为它里面没有任何内容。所以我把
…
放进去，给它一个
背景尺寸：100%100%
（最初是
自动100%
）。但其结果是，显示带有
背景图像的div，但其高度不为父级的100%（即
.col left
）：s


我还尝试使用内联
img
元素，而不是
div
和
背景图像
，但这会导致灾难


@import url（）；
html，正文{
身高：100%；
保证金：0；
}
.section big{/*在此处更改宽度/高度*/
身高：80%；
宽度：80%；
利润率：100px自动25px；
}
.集装箱{
显示：表格；
表布局：固定；
保证金：自动；
身高：100%；
宽度：100%；
}
上校{
显示：表格单元格；
垂直对齐：顶部；
身高：100%；
}
.col左背景图像{
背景：url（“http://www.mediafire.com/convkey/7a01/xaagjmwa7yz1dgdzg.jpg?size_id=b）无重复；
背景大小：100%100%；
}
左上校{
填充：0px 25px；
}
.col h3、.col h5{
填充：0；
保证金：0；
}
.col部分：第n个孩子（1）{
身高：30%；
}
.col部分：第n个孩子（2）{
身高：22%；
}
.col部分：第n个孩子（3）{
身高：22%；
}
.col部分：第n个孩子（4）{
身高：26%；
}
.col部分：第n个子项（奇数）{
背景：水；
}
.col部分：第n个子项（偶数）{
背景：石灰；
}
h3{
颜色：#6c6969；
过渡：颜色0.3s到0.0s；
字体系列：'opensans'，Sans serif；
字号：600；
字体大小：40px；
}
h5{
颜色：#6c6969；
过渡：颜色0.3s到0.0s；
字体系列：'opensans'，Sans serif；
字体大小：400；
字体大小：20px；
}

标题
段落
标题
段落
标题
段落
标题
段落
我只是在第二个JSFIDLE中的“col left bg image”类中添加了“height:100%”，看起来效果不错。div的“背景大小”与图像在div内部的大小不同。图像会调整div的大小以适应它，而背景图像不会：D


如果这不是您的意思，请告诉我：D
完整解决方案（图像向右对齐）：

FIDDLE:
设置元素@MrLister的高度
。col left
div还有一个高度为100%的
col
类。是吗？对不起，是的，我很困惑。每样东西都有一个以%为单位的高度，但由于它一直延伸到
html
，所以它都归结为窗口的高度。克里斯说得对：你忘了设置左bg图像的高度。@lmgonzalves嘿，这解决了我的问题，谢谢。您能否找到一种方法将其父级中的图像div右对齐（
colleft
与
display:table cell
属性）<代码>文本对齐
或
对齐内容
似乎不起作用：这正是我的意思。非常感谢。我对你的答案投了更高的票，表示感谢，但我不得不接受另一个答案，因为他们早些时候（在评论中）回答了这个问题。我相信我下面的那个人得到了答案背景位置：右中'。请记住，背景不像其他元素或div那样工作，它有点像对div进行纹理处理。背景有单独的样式属性来调整大小和重新定位。还有其他属性在将来很可能对您有所帮助（例如背景尺寸：封面）：D查看上的W3页面，非常感谢您的洞察力，我一定会给他们一个阅读=）再次感谢您。
.col-left-bg-image {
    height: 100%;
    background: url("http://www.mediafire.com/convkey/7a01/xaagjmwa7yz1dgdzg.jpg?size_id=b") no-repeat;
    background-size: 100% 100%;
}

.col-left-bg-image {
    background: url("http://www.mediafire.com/convkey/7a01/xaagjmwa7yz1dgdzg.jpg?size_id=b") no-repeat;
    background-size: auto 100%;
    height: 100%;
    background-position: center right;
}