页眉和页脚在

-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

页眉和页脚在

回答

相关问题