第一節 line-heigth的定義
line-height的定義
line-height 行高，
兩行文字基線之間的距離
1.什麼是基線 baseline,x最上面和最下面的距離
2.為何是基線 基線是*（所有線）的基礎
3.需要倆行嗎 兩行的定義已經決定了一行的表現
baseline與字型，不同的字型和基線是有關的。
line-height:200px 與baseline
第一行文字的基線與第二行文字的基線就是行高
為何line-height可以讓單行文字居中
第二節：line-height與行內框盒子模型
行內框盒子模型-css高階必備知識
所有內聯元素的樣式表現都與行內框盒子模型有關！例如浮動的**環繞效果
行內框盒子模型
這是一行普通的文字，這裡有個em標籤。
包含四種盒子
1.內容區域（content area）是一種圍繞文字看不見的盒子，內容區域大小與font-size大小相關
2.內聯盒子（inline-boxes）內聯盒子不會讓內容成塊顯示，而是排成一行，如果外部含inline水平的標籤
span a em 等，則屬於內聯盒子，如果是個光禿禿的文字，則屬於匿名內聯盒子
3.行框盒子模型
行框盒子 line boxes 每一行就是乙個行框盒子，每個行框盒子又是有乙個乙個內聯盒子 inline box組成
4.標籤所在的包含盒子containing box此盒子由一行一行的行框盒子 line boxes組成
所以說行內框盒子模型共有四種
1.內容區域content area
2.內聯盒子inline boxes
3.行框盒子line boxes
4.包含盒子 containing box
第三節：line-height的高度機理 深入理解內聯元素的高度表現
文字佔據的高度
例如這是一行普通的文字，這裡有個em標籤。
document.queryselector("p").clientheight
獲取p標籤的高度。
元素的高度從何而來，是由裡面的文字撐開的？答案 不是
p元素的高度是由line-height決定的。
.test1
.test2
結果：test2的高度還在。
內聯元素的高度是由行高決定的。
問題：line-height命名是倆基線距離，單行文字哪來行高，還控制了高度
前提：1.行高由於其繼承性，影響無處不在，即使單行文字也不例外。
2.行高只是幕後**，高度的表現不是行高，而是內容區域和行間距
內容區域高度（content area） + 行間距（vertical spacing） = 行高（line-heigth）
1.內容區域高度只與字型大小以及字型有關，與line-height沒有任何關係。
2.在simsun字型下，內容區域高度等於文字大小值。
在simsun(宋體)字型下：font-size + 行間距 = line-height
font-size:240px
line-height:360px 則行間距= 360-240 =120px
行間距上下拆分，就有了「半行間距」
總結：行高決定內聯盒子高度，行間距牆頭草，可大可小，保證高度正好等同於行高。
問題 如果行框盒子裡面有多個不同行高的內聯盒子，行框裡面的行高怎麼表現。
一般情況下認為由行框裡面最高的盒子決定。
多行文字的高度就是單行文字高度累加。
如果行框盒子裡面混入inline-block水平元素（如，按鈕），高度如何表現呢
第四節：line-height各類屬性值 ——深入理解line-height不同類別值得不同表現
line-height支援屬性值
normal line-height:normal 預設屬性值 跟使用者瀏覽器
number line-height:1.5 根據當前元素的font-size大小計算。假設文字大小20則行高 line-height = 1.5*20px = 30px
length line-height:1.5em rem px pt
percent line-height:150% 相對於設定了該line-height屬性的元素的font-size計算 假設文字大小20px,則實際行高畫素值是：150%*20 = 30px
inherit line-height:inherit input框等元素預設行高normal，使用inherit可以讓文字框樣式可控性更強。
問題 line-height:1.5
line-height:150%
line-heigth:1.5em
差別表現上無差別，應用元素有差別，line-height:1.5所有可繼承的元素根據font-size重計算行高
line-height:150%/1.5em當前元素根據font-size計算行高，繼承給下面的元素。
推薦使用數值。不推薦使用相對值。
tip:body全域性數值行高使用經驗
body 14*1.4286=12 行高等於20
匹配20畫素的使用經驗---方便心算
縮寫body
第五節:line-height與的表現
行高會不會影響實際佔據的高度？
行高不會影響佔據的高度。
隱匿文字節點 是inline-block表現形式，為了和文字在乙個基線上。所以在下方會留白。
如何消除底部間隙？
1.塊狀化-無基線對齊
img2.底線對齊
img 底線對齊
3.行高足夠小-基線位置上移
.box
小和大文字
基本上高度受行高控制
第六節：line-height的實際應用
實現大小不固定的，多行文字垂直居中。
水平垂直居中
.box
.box>img 基線往上1/2x高度
多行文字水平垂直居中
.box
.box>.text
實際應用：
代替height，避免ie6/7下的haslayout
深入理解css之line height
行高，顧名思義是一行文字的高度，而從規範上來說則是兩行文字基線之間的距離。行高是作用在每乙個行框盒子 line box 上的，而行框盒子則是由內聯盒子組成，因此，行高與內聯元素可以說是非常緊密，行高直接決定了內聯元素的高度 注意 這裡的內聯元素不包括替換元素 對於塊級元素和替換元素，行高是無法決定最...
深入理解css行高line height
行高是相鄰兩行文字基線之間的垂直距離。看清楚是基線，估計有很多前端搞了幾年的都說不出個所以然。小時候我們寫英文26個英文本母的單詞本 隨便找個圖 一行裡面有四條線，在css中乙個行內非替換元素 例如span，em等 其內容區都會存在四條假想的線，分別是底線 bottom 基線 baseline 中線...
深入理解C語言 深入理解指標
關於指標，其是c語言的重點，c語言學的好壞，其實就是指標學的好壞。其實指標並不複雜，學習指標，要正確的理解指標。指標也是一種變數，占有記憶體空間，用來儲存記憶體位址 指標就是告訴編譯器，開闢4個位元組的儲存空間 32位系統 無論是幾級指標都是一樣的 p操作記憶體 在指標宣告時，號表示所宣告的變數為指...