簡單說一下三種情況
父盒子裡面有文字 文字的基線成為父盒子的基線
父盒子無文字 設定overflow hidden 父盒子基線在 margin-bottom [基線下移，底部對齊其他inline元素]
父盒子無文字 父盒子基線在 margin-bottom
這兩個盒子沒設定margin 相當於margin0 mb 就在框的底部
換一些對齊效果試一下
top在頂部，實現頂部對齊，兩個框子也對齊了
bottom在底部，也對齊了
兩個盒子都遵守上面的規則1，忘了就再翻一下
設定top對齊，頂部對齊
因為文字並未改變top 和 bottom 位置
可以推測
bottom也和這個效果一樣
果然，猜想正確。
因為vertical-align 含有兩個屬性 叫做 text-top text-bottom
內聯盒子有自己的 top bottom baseline 【**於 text】
text也有自己的基線
看一下text-top 與父元素【第一行】字型頂端對齊
text-bottom 與父元素第一行字型底部對齊
查了一下text-top啥意思，元素頂端與父元素字型頂端對齊，那父元素還要加點料
為了防止兩個框一開始文字對齊，對子元素使用overflow-hidden，讓基線下移到底部
深入理解vertical align和基線
最近css寫的很多，經常會在div中放再配一些文字什麼的，發現塊元素內部有內聯元素時，塊元素的表現和內聯元素的位置有一些奇奇怪怪的現象，看了張鑫旭老師的這篇收穫很大。現象一 div中放一張，下方出現空隙 為什麼下面會有空隙呢？現在我們在後面加幾個字再看看。可以發現和文字是對齊的，他們有什麼關係嗎？我...
基線變更與非基線變更
一 基線變更 一 變更申請 專案經理或變更申請人填寫 軟體變更申請表 說明要變更的內容 變更的原因 受變更影響的關聯配置項 工作量 變更實施人等，並提交給ccb。二 變更評估 ccb組長負責組織對基線變更申請進行評估。變更的內容是否合理 變更的範圍是否正確 考慮周全 工作 量估計是否合理 基線變更的...
vertical align 樣式理解
文章參考 適用於 行內元素和單元格 table cell 元素 個人理解應用範圍 1 和 文字混排，使用vertical align屬性來定位 2 在table標籤中的td種使用vertical align屬性來定位 可以使用display table cell,注意該標籤父div一定是displa...