在設定vertical-align屬性(只有inline元素有效,對inline-block和block元素無效)時有乙個屬性值:baseline,那麼這個基線是什麼,怎麼確定。
這個基線就是其所在行的line box基線。設定vertical-align:baseline 屬性就是設定其本身元素的inline box(行內框)的基線與行框的基線對其。這裡我們是確定的行框的基線,知道行框基線,那行內框基線就知道了。
有這樣乙個關係
line-height,font-size
丨丨 決定
丨inline box 的高度
丨丨 line box 中的所有 inline box 中最高的 inline box 的頂部 和最低的 inline box 的底部高度之差就是 line box 的高度
丨line box 高度
丨丨 在line box 中直接寫乙個字母 x (這個字母不包含在其他標籤裡面),x的底部位置就是 line box 的基線位置丨丨
丨 知道了line box 基線,因為inline box 不設定vertical-align 情況下,預設基線是與 line box 基線對齊的,所以就知道了 inline box 的基線。(如果設定了vertical-align
丨其他屬性值,那麼基線的位置會相對line box 有所調整
inline box 基線(有些標籤的基線也不是這樣確定的,如img標籤的基線是的底部,textarea標籤的基線也是底部)
參考文章:
CSS 行內框 行框 行高
css 行內框 行框 行高 內容區頂線和底線包含的區域 行內框每個行內元素會生成乙個行內框,行內框是乙個瀏覽器渲染模型中的乙個概念,無法顯示出來,在沒有其他因素影響的時候 padding等 行內框等於內容區域。設定行高時行內框高度不變,半行距分別增加 減少到行框的上下兩邊。簡單說來,行內框就是行內元...
瀏覽器各種位置的確定
通過在短時間內增加高度逐步顯示隱藏元素的函式 function slidedown elem pos 1 10 通過在短時間內增加透明度逐步顯示隱藏元素的函式 function fadein elem pos 1 10 獲取滑鼠游標相對於整個頁面的當前位置 function getx e funct...
SIFT解析(二)特徵點位置確定
影象的尺度空間就是 二維高斯函式與原始影象卷積運算後的結果,尺度空間的表示式 lowe在 中闡述了為什麼使用差分高斯金字塔 1 差分高斯影象可以直接由高斯影象相減獲得,簡單高效 2 差分高斯函式是尺度規範化的高斯拉普拉斯函式的近似,而高斯拉普拉斯函式的極大值和極小值點是一種非常穩定的特徵點 與梯度特...