頁眉和頁腳在

-3

頁

中心任何人都可以添加這個代碼，以使在中心如頁眉和頁腳。左右邊距應該相同頁眉和頁腳在

.newheader 
{ 
    background:#000; 
    height:30px; 
    left:0; 
    position:fixed; 
    width:100%; 
    top:0; 
} 
.newfooter 
{ 
    background:#000; 
    bottom:0; 
    height:30px; 
    left:0; 
    position:fixed; 
    width:100%; 
}

來源

2012-07-24 FAIQ NASEEM

如果你的寬度是100％，它會一直延伸到屏幕上。 *有*沒有餘量。 – 2012-07-24 19:17:33

，如果您使用的固定寬度比嘗試'margin：auto;' – 2012-07-24 19:18:09

技術上他的頁眉和頁腳居中。 – 2012-07-24 19:18:16

定位在頁面的中間分子的標準方法是定義一個寬度比全寬度，然後設置它的利潤率與汽車。

e.g

.newheader { 
    width:960px; /* less than 100% since 100% has no margin */ 
    margin : 0 auto /* top and bottom margin = 0 left and right auto*/ 
}

更新與實例

這裏基於頁面的例子的鏈接。 link

全屏版本link

來源

2012-07-24 19:19:57

，如果您調整瀏覽器的所有contemts即頁眉，頁腳將中心移動 – 2012-07-24 19:34:41

檢查我的鏈接例子 – 2012-07-24 19:51:40

謝謝哥們，你做到了 – 2012-07-24 20:03:16

您是否只是在頁眉和頁腳的內容中居中 - 就像文本一樣？

.newheader    /* remove width: 100% */ 
{ 
    text-align: center; /* this line */ 
    background:#000; 
    height:30px; 
    left:0;   /* this is setting the div all the way to the left */ 
    position:fixed;    
    top:0; 
}

試試這個

.newheader 
{ 
    background:#000; 
    height:30px;  
    position:relative;  
} 

.header_container 
{ 
    top: 0px 
    position: fixed; 
    text-align: center; 
    width: 100%; 
}

把頭部在容器中。

來源

2012-07-24 19:16:21

沒有整頭格在中心，通過給左側50像素相同，所以，我嘗試，但它不工作 – 2012-07-24 19:18:23

我編輯我想這樣http://www.stern.nyu.edu/答案 – 2012-07-24 19:23:18

我想你只需要添加text-align:center;既newHeader和newFooter。由於您的寬度已達到100％，因此它將佔用瀏覽器的100％，因此不會有邊距。

<style type="text/css"> 
.newheader { 
    background:#FFF; 
    top:0; 
    height:30px; 
    position:fixed; 
    width:100%; 
    text-align:center; 
} 

.newfooter { 
    background:#CCC; 
    bottom:0; 
    height:30px; 
    position:fixed; 
    width:100%; 
    text-align:center; 
} 
</style> 

<div class='newHeader'> 
    Test Header 
</div> 
<div> 
    <p>Content</p> 
</div> 
<div class='newFooter'> 
    Test Footer 
</div>

來源

2012-07-24 19:25:25 Jeremy1026

對原帖子的評論：.newheader { background:#000; height:30px; left:5%; position:fixed; width:90%; top:0; }是海報做的嘗試。

如果有90％的寬度，則可以居中這個頭像這樣：

.newheader { 
    /*remove position: fixed; left: 5%; top: 0; */ 
    width:90%; 
    margin: 0 auto; /* this centers it */ 
    height: 30px; 
    background: #000; 
}

下面是結果的樣品JSFiddle。

來源

2012-07-24 19:51:14

頁眉和頁腳在

回答

相關問題