我想讓文本垂直居中,這樣文本的最高點和最低點與它所在的結束div的距離相等。
我有下面的css代碼:
padding-left: 30px;
font-family: 'Playfair Display', serif;
font-weight: 100;
width: 140%;
line-height: 68px;
color: #fff;
font-size: 46px;
border-style: solid;
border-color: #1faf2d;
background-color: #1faf2d;
margin-bottom: 0 !important;
margin-top: 38px;
這就是字體的顏色和高度,看起來像下圖。
這只能通過在底部或頂部添加填充來實現,這可能會因不同的字體而異。我的問題是你為什么要這樣做?按照你的方式建造一個中心會進一步打破平衡。
還有,某些字母的定位,如& quotp,& quot"g,& quot"y,& quot和& quot問,& quot低于中線是由于他們的設計和排版規則。這些字母有下行線,下行線是字母形式中延伸到基線以下的部分。
下行字母在小寫字母中很常見,用于保持文本的整體平衡和易讀性。它們可以區分相似的字體,有助于創建視覺上令人愉悅的文本塊。
當垂直對齊文本時,會考慮下行以確保適當的間距和平衡。通過對齊包含下行線的文本基線,可以保持文本的整體視覺和諧,并防止下行線干擾行距或與其他元素重疊。
在將文本垂直對齊到最高點和最低點的情況下,向下延伸會自然地使文本看起來更低,因為它們延伸到基線以下。這被認為是保持易讀性和保留字體設計意圖的正確對齊方式。
值得注意的是,文本的對齊方式可以根據上下文以及排版人員或設計人員做出的具體設計選擇而有所不同。不同字體的對齊方式可能略有不同,出于創作目的,一些藝術或裝飾字體可能會有意偏離傳統的對齊原則。