行盒的盒模型
常見的行盒：包含具體內(nèi)容的元素
span慷彤、strong、em剥纷、i痹籍、img、video晦鞋、audio等
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
p,span {
background-color: lightblue;
border: 2px solid;
line-height: 3;
}
</style>
</head>
<body>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Veniam praesentium consequuntur totam qui perspiciatis! Neque animi maiores quod repudiandae officia omnis tempora tenetur perferendis necessitatibus in aliquam, nobis accusantium rerum!
</p>
<span>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Rem, pariatur. Assumenda, corporis, nemo repudiandae ipsum ipsam porro soluta enim fugit tempore sapiente illum similique libero aspernatur ex pariatur, quibusdam animi.
</span>
</body>
</html>
先看看這個樣子：
行盒的顯著特點(diǎn)
1蹲缠、盒子沿著內(nèi)容延伸,行盒存放的就是內(nèi)容。
2悠垛、行盒不能設(shè)置寬高
調(diào)整行盒的寬高线定，應(yīng)該使用字體大小、行高确买、字體類型斤讥，間接調(diào)整
3、內(nèi)邊距（填充區(qū)）
水平方向有效，垂直方向僅僅會影響背景芭商，不會占據(jù)空間
4派草、邊框
水平方向有效，垂直方向不會占據(jù)空間
5铛楣、外邊距
水平方向有效近迁，垂直方向不會占據(jù)空間
行塊盒
display:inline-block 的盒子
1、不獨(dú)占一行
2簸州、盒模型中所有尺寸都有效
空白折疊
空白折疊鉴竭，發(fā)生在行盒（行塊盒）內(nèi)部 或 行盒（行塊盒）之間
可替換元素 和非可替換元素
大部分元素，頁面上顯示的結(jié)果岸浑，取決于元素內(nèi)容搏存，稱為非可替換元素
少部分元素，頁面上顯示的結(jié)果矢洲，取決于元素屬性璧眠，稱為可替換元素
可替換元素：img、video兵钮、audio
絕大部分可替換元素均為行盒蛆橡。
可替換元素類似于行塊盒，盒模型中所有尺寸都有效掘譬。
