在CSS中,改變字體上下間距是一件非常簡單的事情。可以通過line-height屬性來實現。該屬性定義了文本行框(text line box)高度,它是由行內框包含的所有內容的高度確定的。因此,line-height會影響文本行的上下間距。
p { font-size: 16px; line-height: 1.5; /* 默認值為normal,實際值因字體而異 */ }
如上所示,通過設置p元素的line-height屬性,可以控制文本行之間的間距。具體數值為字體大小的倍數,例如上述例子中,line-height為16px的1.5倍,即24px。
需要注意的是,當使用不同字體時,其字體間距可能不同。因此,同樣的line-height值在不同字體下可能會產生不同的效果。此時需要對不同字體進行調整,以達到理想的效果。
p { font-size: 16px; font-family: 'Helvetica Neue', sans-serif; line-height: 1.2; } pre { font-family: 'Courier New', monospace; line-height: 1.6; }
如上示例代碼中,分別對p和pre元素設置了不同的字體和line-height屬性值,以實現其所需的效果。
除了使用line-height屬性,還可以通過調整margin和padding屬性來間接地改變文本行之間的間距。但這種方法并不直接,且相對復雜。因此,一般情況下仍建議使用line-height進行調整。