頭部100％寬度內包裝

所以基於我的結構我使用的頭部分是在一個包裝div。這種包裝div有一組寬度頭部100％寬度內包裝

width: 1000px;

但我想我的頭去過去這1000像素寬度，我想的標題是瀏覽器的整個寬度！

你可以看到在我的jsfiddle代碼：https://jsfiddle.net/7eLnegvd/ 您可能需要展開預覽部分的寬度，所以你可以看到頭不填充100％的寬度。

謝謝！

來源

2016-03-06 Munch

把它從包裝中拿出來......這並不難。 –

你爲什麼不改變你的方式？不要把你的標題標籤放在你的包裝div中。使用Semantic標籤，如標題標籤，主標籤，頁腳標籤和...外部div包裝和樣式標題標籤獨立像一個BOSS！

HTML：

<body> 

<header>header</header> 
<div class="wrapper">body</div> 
<footer>footer</footer> 

</body>

CSS：

*{ 
    box-sizing: border-box; 
    text-align: center; 
    font-size: 30px; 
    color: white; 
} 

header, 
footer{ 
    width: 100%; 
    height: 100px; 
    background-color: black; 
} 

.wrapper{ 
    width: 1024px; 
    height: 2000px; 
    background-color: gray; 
}

來源

2016-03-06 19:21:46

只是刪除width: 1000px;，默認情況下包裝會是頁面的整個寬度的塊元件

來源

2016-03-06 19:23:26 Bxx

如果你想要一個e的width屬性lement是最大寬度，你可以使用百分比而不是像素。您還可以向代碼添加其他寬度屬性，並設置所需的最小或最大寬度。

CSS例子：

#wrap { 
min-width: 5em; 
max-width: 100%; 
}

此外，建議使用CSS3 @media Rule這種類型的設計，使之更適應。

來源

2016-03-06 19:35:40 lowmatic

頭部100％寬度內包裝

回答

相關問題