HTML+CSS 輕松入門之內(nèi)聯(lián)元素
在html中，<span>、<a>、<label>、 <strong> 和<em>就是典型的內(nèi)聯(lián)元素（行內(nèi)元素）（inline）元素。當(dāng)然塊狀元素也可以通過代碼將元素設(shè)置為內(nèi)聯(lián)元素
display:inline
內(nèi)聯(lián)元素特點(diǎn)：
1、和其他元素都在一行上；
2、元素的高度、寬度及頂部和底部邊距不可設(shè)置；
3、元素的寬度就是它包含的文字或圖片的寬度，不可改變。
下面我們來寫一段代碼，塊狀元素是可以設(shè)置寬高的 ?內(nèi)聯(lián)元素是設(shè)置不了寬高的
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
a{
width:100px;
height:50px;
background-color:green; /*設(shè)置背景色*/
color:#fff; /*設(shè)置字體顏色*/
}
</style>
</head>
<body>
<a href="#">PHP中文網(wǎng)</a>
</body>
</html>看上面這段代碼，a 是內(nèi)聯(lián)元素，當(dāng)我們設(shè)置寬高，是沒有效果的，轉(zhuǎn)換成塊狀元素就會有明顯效果
下面我們來寫一個實(shí)例 ?把塊狀元素轉(zhuǎn)換成內(nèi)聯(lián)元素
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
div{
display:inline; /*轉(zhuǎn)換成內(nèi)聯(lián)元素*/
/*轉(zhuǎn)換成內(nèi)聯(lián)元素之后，我們設(shè)置寬高，背景色，文字顏色*/
width:300px;
height:200px;
background-color:green;
color:red;
}
</style>
</head>
<body>
<div>歡迎大家來到php中文網(wǎng)</div>
</body>
</html>以上代碼中，塊狀元素轉(zhuǎn)換成內(nèi)聯(lián)元素之后 是不可以設(shè)置寬高的
