頁頭寬度爲100％沒有工作

.page-header{ 
    background: #393e4f; 
    width: 100%; 
    height:50px; 
    margin: 0 auto; 
}

HTML

<div class="container"> 
    <div class="page-header"><span>XYZ</span></div> 
    </div>

我想要的頁面我page-header是100％的寬度。

我得到這樣的結果，我不想要的。

謝謝。

編輯我的代碼試試下面我的代碼 –

據bootstap的默認填充去除填充 –

bootstrap container類增加了一個邊距。如果要使用標題全寬，請將其放在容器外。

容器寬度在本節的引導CSS中給出。

2016-08-02 08:19:17

着」我操縱'container'類？ –

當然可以。但如果要在其他頁面中使用容器類，則會變得雜亂無章。 –

好的..謝謝。我會把它放在外面。 –

-1

將任何固定寬度的網格佈局轉換爲全寬佈局，方法是將最外部的容器更改爲.container-fluid。

<div class="container-fluid"> 
    <div class="row"> 
    ... 
    </div> 
</div>

2016-08-02 08:22:29

@Leothelion現在我編輯了我的上面的代碼，這將刪除填充 –

開始時的主體元素具有默認邊距。這就是爲什麼你有這個空白空間。在大多數主流瀏覽器中，所有邊的默認邊距都是8px。它由您的瀏覽器提供的用戶代理樣式表以像素爲單位定義。只需將此代碼插入到您的代碼中即可。

body 
    { 
    width:100%; 
    margin:0; 
    }

2016-08-02 08:28:04

我認爲你錯了。問題是Body「container」的默認值是8px。他把所有的孩子元素都推到了裏面。如果我錯了，請糾正我。 –

如果只刪除.container類，問題仍然存在。 –

回答