行高(line-height)是 CSS 中一個重要的屬性之一,它用于控制一行文字的高度,即文字與文字之間的垂直距離。在網頁設計中,行高對于提高可讀性和美觀度起到了重要作用。
行高的數值可以用像素(px)或百分比(%)表示,也可以用單位“倍數”(例如 1.2)表示,例如:
p { line-height: 1.5; /* 行高為字體大小的 1.5 倍 */ line-height: 1.2em; /* 行高為字體大小的 1.2 倍 */ line-height: 150%; /* 行高為字體大小的 150% */ }
需要注意的是,行高的數值不僅影響文字的垂直距離,還會影響行框(line box)的高度。行框是在行內元素兩側形成的不可見矩形區域,包含了同一行內的所有元素和文字。行框的高度由字體大小和行高共同決定。
行高還可以用于對齊元素。通過設置元素的行高和高度相等,可以實現文字和容器底部對齊的效果。例如:
div { height: 100px; line-height: 100px; /* 行高和高度相等,實現底部對齊 */ }
總之,行高是 CSS 中一個非常有用的屬性,它對于頁面排版、可讀性和美觀度的提升起到至關重要的作用。
上一篇css 那種情況用定位
下一篇css 避免元素擋住