一、div标签
1.作用：一般用于配合CSS完成网页的基本布局
2.例子：
<style>
.head{
width:980px;
height:100px;
background:red;
margin:auto;
}
.content{
width:980px;
height:300px;
background:green;
margin:auto;
}
.footer{
width:980px;
height:100px;
background:blue;
margin:auto;
}
.logo{
width:280px;
height:50px;
background:purple;
float:left;
margin:auto;
}
.nav{
width:180px;
height:20px;
background:yellow;
float:right;
margin:auto;
}
</style>
</head>
<body>
<divclass="head">
<divclass="logo"></div>
<divclass="nav"></div>
</div>
<divclass="content">
</div>
<divclass="footer">
</div>
二、span标签
1.作用：一般用于配合css修改网页中的一些局部信息
2.例子：span适用于修改我们单独要求的一块区域的属性
span{
color:red;
}
..........省略代码........
<divclass="footer">
<p>我是用来<span>测试span标签</span>的</p>
</div>
三、div和span有什么区别
1.div会单独占领一行
<div>我是div</div>
<div>我是div</div>
<div>我是div</div>
<span>我是span</span>
<span>我是span</span>
<span>我是span</span>
2.div是容器级的标签，而span是文本级的标签
四、容器级的标签和文本级标签的区别：
容器级的标签是可以嵌套其他所有的标签
文本级的标签只能嵌套文字、超链接、图片
容器级的标签：div\h\ul\ol\li...
文本级的标签：span\p\buis\stong\em\ins\del.....
举例：容器级别就不举，因为什么都支持；举一下文本级标签的例子
<p>
我是文本级别标签
<h1>我是h1标签</h1>
</p>
从上面的例子可以看出我们的源码在被执行的时候，被浏览器纠正，看一下第二张图，浏览器把h1标签给拿出来了，p标签给补全了?。
2.?注意点：我们不用去记忆这标签的是哪种类型的，在正式开发环境中要嵌套都是潜逃在div中，或者按照组标签来嵌套
如果您觉得本文的内容对您的学习有所帮助：
关键字：
jquery