教程集 www.jiaochengji.com
教程集 >  CSS教程  >  经典实例  >  正文 第三步:将网站分为五个div,网页基本布局的基础

第三步:将网站分为五个div,网页基本布局的基础

发布时间:2020-05-24   编辑:jiaochengji.com
教程集为您提供第三步:将网站分为五个div,网页基本布局的基础等资源,欢迎您收藏本站,我们将为您提供最新的第三步:将网站分为五个div,网页基本布局的基础资源

 1.将“第一步”提到的五个部分都放入盒子中,在html文件中写入:

<div id="page-container">
<div id="main-nav">Main Nav</div>
<div id="header">Header</div>
<div id="sidebar-a">Sidebar A</div>
<div id="content">Content</div>
<div id="footer">Footer</div>
</div>

表现如下:

2.为了将五个部分区分开来,我们将这五个部分用不同的背景颜色标示出来,在css文件写入:

#main-nav {
background: red;
height: 50px;
}
#header {
background: blue;
height: 150px;
}
#sidebar-a {
background: darkgreen;
}
#content {
background: green;
}
#footer {
background: orange;
height: 66px;
}

 

您可能感兴趣的文章:
第三步:将网站分为五个div,网页基本布局的基础
Google排名不是简单的网页优化
Google左侧排名不是简单的网页优化
DIV CSS网页布局对SEO优化有哪些影响
怎么让百度快速收录新网站
新手seo入门手册
python的爬虫是什么意思
Google PageRank排名的新算法(三)
学完PHP能做什么?
Google排名新算法之三

[关闭]
~ ~