- line-height指兩行之間基線（baseline）的距離（其實(shí)一行也有效）
- 行內(nèi)寬盒子模型（從小到大汁针，包含關(guān)系）
Paste_Image.png
- 內(nèi)斂元素的高度是由line-height決定的斋射，不是由font-size決定的赐俗。
- 行高由于其繼承性粥烁，影響無(wú)處不在袜硫，即使單行文本也不例外挤安；高度的表現(xiàn)不是行高，而是內(nèi)容區(qū)域和行間距戈鲁，內(nèi)容區(qū)域高度+行間距=行高仇参。
- 內(nèi)容區(qū)域高度只與字號(hào)和字體有關(guān)，在simsun字體下就是字號(hào)婆殿。
- 行間距是上下拆分的诈乒。用于保證高度正好等于行高。
- 多行文本的高度就是單行文本高度的累加
- line-height值的類型：normal（默認(rèn)值）婆芦，數(shù)值怕磨，百分比，rem/em消约，inherit（繼承）
- 1.5肠鲫、150%、1.5em計(jì)算上沒(méi)有區(qū)別或粮，但1.5所有可繼承元素根據(jù)font-size重計(jì)算行高导饲；而150%、1.5em根據(jù)當(dāng)前font-size計(jì)算行高氯材，繼承給下面的元素渣锦；
- reset.css中建議使用1.5這種寫法統(tǒng)一行高。
- 行高不會(huì)影響圖片實(shí)際占據(jù)的高度浓体，而是影響圖片所在行文字的高度泡挺，即使沒(méi)有文字
Paste_Image.png
Paste_Image.png
- 如何消除圖片底部間隙：
1、圖片塊狀化{display:block}
2命浴、圖片底線對(duì)齊{vertical-align:bottom娄猫；}
3、行高足夠猩小：{line-height:0;} - 單圖片水平居中
.box{line-height:300px;text-align:center;}
.box>img{vertical-align:middle;} - 多行文本圖片水平居中媳溺，實(shí)現(xiàn)方式與當(dāng)行相同，區(qū)別是要把多行文本所在容器的display水平轉(zhuǎn)換成和圖片一樣（inline-block）碍讯，以及重置外部繼承的text-align和line-height屬性值
.box{line-height:250px;text-align:center}
.box>.text{display:inline-block;line-height:normal;text-align:left;vertical-align:middle;max-widht:100%}
.box>img{vertical-align:middle}
