html - div的背景色仅限一定高度

Question

我有一个透明的 div，我想将背景颜色设置为 div 整个大小的 60%。 示例:我的网站上有一个带有图像的内容。假设我希望将 60% 的内容的背景颜色设置为白色，内容的上部保持透明。

.test p{
    background-color: #f6d8d8;
}
.test p:first-child{
    background-color: transparent;
}

这是一个示例:http://jsfiddle.net/318wsehf/ 我只想在最后两段有红色。第一段应该保持透明，因为它设置在外部 div 中。我如何应用这种样式？

我已经更改引用:http://jsfiddle.net/318wsehf/1/

Answer 1

您可以使用渐变

.test{
    background: linear-gradient(to bottom, #f6d8d8 0%,#f6d8d8 40%,rgba(0,0,0,0) 40%);
}