内联元素和块级元素的区别 内联元素——是没有宽和高的 1、 其大小是由自己本身的字体大小决定，若要进行上下对齐时，用行高（line-height）设置
2、还可以运用定位的方法进行设置： float定位 （left、right）
postion定位（static、relative、absolute、fixed） 图片与文字对齐的方法：（在图片中定义）vertical-align：middle；
border-radius：属性值 ；（设置圆角，其值越大，更圆） 例如：border-bottom-right-raius：50px；（是将右下角进行圆角化） <strong> </strong> 强调元素 <button> <button> 按钮元素
块级元素——有自定义的宽与高 其定位方法有很多种，方法如下： 1、 padding定位
2、 border定位
3、 float定位
4、 position定位
下面这个例子就是用来说明其区别
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
.mian{
width: 300px;
height: 50px;
background-color: #faa;
text-align: center;
}
.mian-sp1,
.mian-sp2{
width: 100px;
height: 20px;
background-color: #eee;
/*margin-top: 100px;*/
/*float: left;*/
}
.mian-sp2{
background-color: #de1;
margin-top: 100000px;
/*margin-left: 10px;*/
/*line-height: 50px;*/
/*vertical-align: middle;*/
}
</style>
</head>
<body>
<div class="mian">
<!-- <div class="mian-sp1">div1</div>
<div class="mian-sp2">div2</div> -->
<span class="mian-sp1">123</span>
<span class="mian-sp2">2345</span>
</div>
</body>
</html>
内联元素的结果：不管如何的设置margin或是padding都无效。
块级元素的结果：因为有宽和高，设置上面两个元素属性，会发生改变
