使用CSS的居中页面 [英] centered page using css

问题描述

你好

有人能帮我用html div和css实现这个布局吗？

它是带有标头和页脚的居中页面布局

< ahref> http：//s12.postimg.org/4641gv00d/layout.jpg [ ^ ]。

分别给出html和css代码

hello
can anyone help me achieve this layout using html div and css?
It is centerd page layout with masthead and footer
<ahref>http://s12.postimg.org/4641gv00d/layout.jpg[^].
give html and css code separately

推荐答案

html code
<div id="header">
</div>
<div id="wrapper">

</div>
<div id="footer">
</div>

和css文件：

身体

{

text-align：center;

背景色：＃ffd79b;

最小宽度：760px;



}









#header

{

top： 0px;

边框：3px纯橙色;

保证金：0自动;

宽度：1000px;

高度：300px;

背景颜色：白色;



}





#wrapper

{宽度：1000px;





保证金：0 auto;





text-align：left;

border：3px solid orange;

身高：500px;

职位：亲属;

背景颜色：白色;





}

#footer

{

保证金：0自动;

宽度：1000px;

margin-top：auto;

border：3px纯橙色;

身高：100px;

background-color：white;

}

and css file:
body
{
text-align: center;
background-color:#ffd79b;
min-width:760px;

}




#header
{
top:0px;
border:3px solid orange;
margin:0 auto;
width:1000px;
height:300px;
background-color:white;

}


#wrapper
{ width:1000px;


margin:0 auto;


text-align: left;
border:3px solid orange;
height:500px;
position:relative;
background-color:white;


}
#footer
{
margin:0 auto;
width:1000px;
margin-top:auto;
border:3px solid orange;
height:100px;
background-color:white;
}

这篇关于使用CSS的居中页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！