vertical align的垂直對齊方式

2021-10-08 05:59:05 字數 287 閱讀 4302

做專案時,會發現與後面的文字總是對不齊,主要是因為img預設的是基線對齊,也就是拼音中四線三格的第三條線

一般只有兩個地方使用vertical-align,做垂直對齊

取值top/middle/bottom

設定table中內容的對齊方式

取值 top/middle/bottom/baseline

基線 預設值

baseline 基線,即拼音中四線三格的第三條線

設定與前後文字的垂直對齊方式

一般專案中會將所有的與文字的對齊方式,該為非基線對齊

關於vertical align的種種

有些時候vertical align的渲染結果並不同我們想象的一樣。雖然現在已經有很多 css 屬性可以完美替代vertical align的渲染效果,但有些時候碰到還是很頭疼,所以最好還是搞清楚它。作用物件 inline inline block子元素。這個屬性失效的情況 作用物件是塊級元素 因為...

元素的vertical align屬性

一,vertical algin元素的屬性值 二,vertical align只對以下元素起作用 1,inline 2,inline block 3,inline table 基本的inline元素都是標籤裹著文字。inline block元素 是在行內中的塊級元素。他們可以有寬度和高度 通常情況下...

vertical align 樣式理解

文章參考 適用於 行內元素和單元格 table cell 元素 個人理解應用範圍 1 和 文字混排,使用vertical align屬性來定位 2 在table標籤中的td種使用vertical align屬性來定位 可以使用display table cell,注意該標籤父div一定是displa...