Question

我正在尝试使用CSS为整个页面添加内部光晕。

CSS：

body {
    margin: 0;
    padding: 0;
    border: 0;
    width: 100%;
    height: 100%;
    -moz-box-shadow:inset 0 0 10px #000000;
    -webkit-box-shadow:inset 0 0 10px #000000;
    box-shadow:inset 0 0 10px #000000;
    background-image: url('/images/bg.png');
}

那半工作。内部发光在那里，但它不会拉伸到页面的整个高度。

http://snapplr.com/g65v.png

有一种简单的方法吗？

Answer 1

问题是body元素没有填满窗口。

将此添加到您的CSS：

html, body { height: 100%; }

Answer 2

尝试将body切换为html，例如：

html {
margin: 0;
padding: 0;
border: 0;
width: 100%;
height: 100%;
-moz-box-shadow:inset 0 0 10px #000000;
-webkit-box-shadow:inset 0 0 10px #000000;
box-shadow:inset 0 0 10px #000000;
background-image: url('/images/bg.png');
}

链接：http://jsfiddle.net/LUREm/

使用CSS为页面添加“内部发光”

2 个答案: