设置整个网页的背景颜色(浏览器的窗口)

时间:2015-05-24 20:20:20

标签: javascript html css

我对html,css等的经验很少,所以对于那些用于创建网页的人来说,这看起来很像一个愚蠢的问题。 但我无法设置整个窗口的背景颜色。

我的意思是浏览器的窗口。

例如:imgur

我已经尝试过设置 body 的背景颜色,当然没有成功。

任何帮助/链接都将不胜感激。

编辑:

可能由于我的英语,我无法解释我的意思。我会再尝试。 在我发布的链接中,网页位于屏幕中央(占网站的99%)。

这是身体,不是吗?

更改bg颜色没有问题,请停止发布明显的答案。

我需要更改身体右侧和左侧列的bg颜色,就像我发布的链接一样。 所以,我猜有一种方法可以设置整个窗口的颜色/纹理,而不仅仅是身体。

4 个答案:

答案 0 :(得分:1)

You can use the background-color tag, which can be read about more in-depth at W3C http://www.w3schools.com/cssref/pr_background-color.asp

An example use of this would be the following:

CSS:

body{
  background-color: red;
}

HTML:

<body style = "background-color: red;">

答案 1 :(得分:1)

Setting the background-color of the body element should work. If you have uncolored parts on the sides, set margin and padding to 0 as well. You might also have another element with a background color that is overlapping the body element and that is why you don't see the color.

body {
  background-color: red;
}
<html>

<body>
</body>

</html>

答案 2 :(得分:1)

Here is fiddle how to change body

<body>
    <div>
        some text
    </div>
</body>

body{
    background-color:yellow;
    height:100px;
}

div{
    background-color:red;
}

答案 3 :(得分:1)

marco -

The body background of the page is a solid color, but they do apply an image (texture) to div elements on the page. I think this is what you are trying to duplicate. See the css in the example below, especially the background: url(); The texture they use is very subtle and not easy to see on my screen.

image url: http://s.imgur.com/images/main-bg.png

You can inspect the site yourself using the developer tools of your browser (usually press F12) and looking at the styles applied to the page.

This is the actual style from the page:

#fullbleed-bg {
    width: 100%;
    min-width: 1000px;
    height: 429px;
    position: absolute;
    top: 50px;
    background: url("//s.imgur.com/images/main-bg.png") no-repeat scroll center top transparent;
    max-width: 100%;
    overflow-x: hidden;
}

Run the snippet to view:

<html>
<head>
<style type="text/css">
  
body {
    width: 100%;
    height: 200px;
    background-image: url("//s.imgur.com/images/main-bg.png") 
}
</style>
</head>
<body>
</body>
</html>