内聯元素和塊級元素的差別 内聯元素——是沒有寬和高的 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都無效。
塊級元素的結果：因為有寬和高，設定上面兩個元素屬性，會發生改變
