Question

我是CSS / HTML的新手。对于一个学校项目，我不得不建立一个无响应的1140px网站。我决定我希望1140px在两侧都有白色背景颜色（在浏览器中间），我希望它有深灰色。

所以我把一个深灰色的颜色加到我的html上，一个白色的颜色到我的身体，宽度为1140px。我不得不在html上放一个“overflow：hidden”，否则身体的白色背景颜色就不显示了。但问题是，由于这个隐藏的溢出，我的滚动条不在浏览器的最右侧，而是在我的身体右侧。

我的问题的屏幕截图：

http://i68.tinypic.com/hvxjdj.png

 html {
    background-color: rgb(50,50,50);
    overflow: hidden;
}

body {
    line-height: 1;
    width: 1140px;
    margin: 0 auto;
    background-color: white;
    overflow: auto;
    box-shadow:0px 0px 20px #000000;
}

有没有办法将我的滚动条向右移动并忽略溢出隐藏属性？或者是另一种获得相同背景效果的方式？

Answer 1

删除html上的overflow:hidden并使您的身体宽度为100％，然后使其背景颜色透明。这将为您提供一个完整的深灰色页面（因为HTMl已经有了greay bckground）。现在在body中添加一个div并将其背景颜色设置为白色。同时通过给出一些左边距和右边距将你的div放在中心，将所有内容放入这个div中。多数民众赞成，现在你将在浏览器的最右边有一个滚动条。这是一个可能对您有帮助的片段

html{
  background-color:grey;
}

body{
  width:100%;
  height:auto;
  background-color:transparent;  
}

.appContainer{
   margin: 0px 40px 0px 40px;
   background-color:white;  
   height:2000px;
}

<body>
 <div class="appContainer">
 
 </div>
</body>

我的滚动条不在浏览器的右侧？

1 个答案: