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-使頁面背景跨越？

回答

相關問題