Question

我想在页面正文中添加外部阴影，例如：

<html>
  <head>
    <title>Shadow</title>
    <style>
      html{height:100%;}
      body{height:100%;}
      #shadow{width:1200px;background:url('http://i.stack.imgur.com/w3fOE.png');height:100%;margin: 0 auto;}
      #theMainContainer{width:900px;margin:0 auto;background-color:red;height:100%;text-align:center; color:white;}
    </style>
  </head>
  <body>
    <div id="shadow">
      <div id="theMainContainer">
        i have <font color="black">shadow</font> in the left side and the right side of the page ,<br>But i have space in the top and in the bottom of the page(what is the best way to fix it?).
      </div>
    </div>
  </body>
</html>

我在页面的顶部和底部都有空格。如何移除空间并使阴影达到100％高度？

Answer 1

将margin: 0添加到正文：

body {
  height: 100%;
  margin: 0;
}

Answer 2

您需要添加以下css规则来重置浏览器的默认样式。

body, html {
    margin: 0;
    padding: 0;
}

身体阴影Css

2 个答案: