css-使页面背景跨越？

我试图制作一个横跨页面的标题。css-使页面背景跨越？

我看遍了所有的互联网，并尝试他们说的工作，但它没有。至少对于我来说。

这就是我得到：

这里是我的代码：0像素：

/* USEFUL STUFF 
 
green colour #1(like the .BigTitle): #00CC00 
 
cream colour: #FFFFCC 
 
*/ 
 
body{ 
 
    background-color:#FFFFCC; 
 
} 
 
.BigTitle{ 
 
    background-color: #00CC00; 
 
    width: 100%; 
 
    text-align: center; 
 
}

<div class="BigTitle"><h1>Loriem Ipsum</h1></div> 
 
<div class="sidebar"> 
 
    <ul> 
 
    <b> 
 
     <li>STUFF</li> 
 
     <li>STUFF</li> 
 
     <li>STUFF</li> 
 
     <li>STUFF</li> 
 
    </b> 
 
    </ul> 
 
</div> 
 
<div class="what"> 
 
    <h1>Lorium Ipsum</h1> 
 
    <p>Bacon ipsum dolor amet fugiat t-bone kevin prosciutto. Duis biltong filet mignon shankle bacon ground round, commodo salami do. Ex qui pastrami cow, aute anim alcatra. Jerky sausage ullamco tail, aliquip et nostrud excepteur beef ad cupidatat sint filet mignon chicken.</p> 
 
    <p>Turducken meatloaf ham hock nulla meatball. Ullamco qui officia quis filet mignon fugiat. Flank irure pig, sausage consectetur shoulder ea incididunt. Aliqua eu kielbasa andouille aute mollit prosciutto enim shankle rump irure. Bresaola consectetur aute, laboris beef short loin dolore. Incididunt sed labore ad fatback, voluptate dolore mollit ea pancetta tongue.</p> 
 
    <p>Lorem esse kevin dolor jowl eiusmod shoulder deserunt kielbasa swine nisi et pancetta sunt ribeye. Est aliqua flank dolore dolor pork chop turducken in ex. Fugiat shank pork belly jowl id, irure turducken pork loin pork velit laborum tri-tip. Tenderloin ribeye proident nulla hamburger irure mollit short ribs ball tip pastrami. Pork chicken ex pastrami.</p> 
 
    <p>Nulla tempor pork chicken in ullamco eiusmod consectetur ut. Venison beef ribs drumstick, shank in tenderloin dolor. Boudin aute proident sed, cow deserunt tongue sirloin porchetta aliquip dolor dolore aliqua chicken. Alcatra ham laboris pig aute landjaeger in occaecat anim consectetur tempor. Brisket nostrud commodo magna reprehenderit, ribeye nisi pancetta esse qui. Ex hamburger quis, leberkas meatloaf turkey shoulder sint filet mignon picanha nulla sirloin.</p> 
 
    <p>Veniam adipisicing meatloaf, esse lorem doner andouille sirloin est chuck ad pariatur. Aliqua enim ham labore brisket leberkas. Drumstick id tri-tip, fugiat sint bresaola aliqua hamburger ullamco pig anim chicken cow aliquip boudin. Cillum venison non, picanha incididunt esse ex bresaola andouille irure anim jerky. Dolor corned beef leberkas, velit voluptate pork loin sunt pork pariatur.</p> 
 
</div>

来源

2015-10-26 Procinogen

提示：http://stackoverflow.com/questions/11066823/margin-and-padding-of-body-tag – Turnip

注意'center'元素已经过时。在任何情况下，都不要放在'body'内。 – Oriol

在你的CSS的身体{保证金，明确设置}

来源

2015-10-27 00:02:06 Justice

对不起队友，我没有看到你已经回答了这个问题。我也是这样做的。良好的工作 –

是的，一切顺利，谢谢。 – Justice

以下是一个

你需要操纵CSS

来源

2015-10-27 00:04:37

margin财产有很多方法如何实现你所需要的工作DEMO。最简单的一个是设置

body { 
    margin: 0; 
}

但这样一来，您在内容文本将在页面的最边缘开始。因此，您还需要对文本内容或其包装应用一些边距或填充。

另一种方式是重新定义标题的填充和边距，以便它会超过身体边距。所有你需要做的是编辑您的.BigTitle类是这样的：

.BigTitle{ 
    background-color: #00CC00; 
    width: 100%; 

    padding-left: 8px; 
    margin-left: -8px; 
    padding-right: 8px; 
    margin-right: -8px; 
}

这取决于您选择什么样的方式。

来源

2015-10-27 00:10:34 TeeJay

从CSS Reset：

如果你不知道，每个浏览器都有自己默认的“用户代理”的样式表，它使用使无样式的网站看起来更清晰。例如，大多数浏览器在默认情况下都会将链接变成蓝色，并且访问链接为紫色，为表格添加一定数量的边框并填充填充，将可变字体大小应用于H1，H2，H3等，并将填充量设置为某种程度。。

由于您没有重置CSS，因此您会让浏览器的默认样式规则干扰您的CSS。

您可以使用CSS重置来解决您的问题，或者只需将margin: 0;应用于body元素。

body { 
    background-color: #FFFFCC; 
    margin: 0; 
}

来源

2015-10-27 00:20:19

css-使页面背景跨越？

回答

相关问题