更改正文元素的背景颜色和宽度

我试图设置body元素的背景。我已经改变了宽度body，我希望背景适合这个宽度，但是它会填满整个屏幕。我将如何解决它？更改正文元素的背景颜色和宽度

body { 
 
border: 1px solid black; 
 
width: 500px; 
 
margin: 0 auto; 
 
background: black; 
 
}

来源

2016-02-14 frosty

参见[应用的背景和/或]（http://stackoverflow.com/questions/10947541/applying-a-background-to-html-and-or-body）和[宽度小于它的背景]（http://stackoverflow.com/questions/11083984/html-width-is-less-than-its-background） – BoltClock

你实际上是在做，除非当你不声明背景颜色html元素，它则采取body元素的背景颜色。因此，你没有看到差异。

只需得到html元件不同的背景颜色，也给body一些height：

html { 
 
    background-color: red;  /* new */ 
 
} 
 

 
body { 
 
    border: 1px solid black; 
 
    width: 500px; 
 
    height: 500px;    /* new */ 
 
    margin: 0 auto; 
 
    background: black; 
 
}

理解html，bodybackground-color和之间的关系。

所有元素的初始background-color是transparent。

如果未指定html元件的background-color是（即，transparent）然后，在CSS规则，浏览器给它body元件的background-color。

从规格：

3.11.2. The Canvas Background and the HTML <body> Element

对于文档根元素是HTML HTML元件或XHTML html元件：如果background-image的根元素所计算的值是none及其background-color是transparent, 用户代理必须改为传播计算出的的值来自该元素的第一个HTML元素的背景属性BODY或XHTML body子元素。使用的BODY元素的背景属性的值是它们的初始值，并且传播的值被视为在根元素上指定的值。建议使用，HTML文档的作者指定BODY元素的背景为，而不是HTML元素。

来源

2016-02-14 03:35:48

啊。我懂了。所以HTML模仿身体的背景，当没有声明自己的时候。我从来不知道这一点。; P – frosty

虽然你在这里，但是，你知道是否有一种方法可以将CSS应用于除了身体之外的所有元素？ – frosty

我更新了关于'html'和'background-color'的更多细节。 –

更改正文元素的背景颜色和宽度

回答

相关问题