div与span的区别：
div标签属于块级元素，span标签属于行内元素，使用对比效果如下：
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>111</title>
<style>
div{
background-color: #CC99CC;
color: blue;
width: 400px;
}
span{
background-color: #CC99CC;
color: blue;
width: 400px;
}
</style>
</head>
<body>
<div>div</div>
<div>div</div>
<span>span</span>
<span>span</span>
</body>
</html>
另外，在html页面中，无法直接设置span的高度和宽度，如果需要改变其宽高，就需要将其转变为块体元素（block）或行内块体元素（inline-block）：
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>111</title>
<style>
.class1{
background-color: #CC99CC;
color: blue;
width: 400px;
height: 50px;
}
.class2{
background-color: #CC99CC;
color: blue;
width: 400px;
height: 50px;
display:block;
}
</style>
</head>
<body>
<span class="class1">示例</span>
<span class="class2">示例</span> </body>
</html>