0

我希望不透明度层填充到与内容量无关的底部。所以内容很少;一直延伸到底部,内容丰富;延伸到底部。

我已经尝试了大量的方法,例如border-box, display:block,以及我在过去三天中发现的所有其他方法,试图弄清楚这一点。

我还尝试将内容设置为 a min-height:800px,这样即使内容很少,它也会始终显示为已填充,但是当内容超过这些 800 像素时,也会出现同样的问题。 http://jsfiddle.net/rZkSx/或有问题的原始站点:http ://www.fredberentsen.com/fotosafari/index.html

简短版本:
无论内容大小,我都希望白色不透明层从上到下填充。

4

1 回答 1

0

在 HTML 中添加一个带有类的 div(例如:掩码)

<div class="mask></div>

并在 CSS 中将规则添加到该类

.mask {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: -1;
    /* Fallback for web browsers that doesn't support RGBa */
    background: rgb(255, 255, 255);
    /* RGBa with 0.6 opacity */
    background: rgba(255, 255, 255, 0.6);
    /* For IE 5.5 - 7*/
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
}

我也更新了你的小提琴

于 2013-03-29T12:50:26.553 回答