在CSS中,行高(line-height)是指所謂的“行內框盒子”(inline box)的高度。這個值決定了文本在行內框盒子中的垂直位置,以及框盒子之間的垂直間距。
行高的寫法有以下幾種:
line-height: normal; /* 默認值,通常為1.2-1.5倍字體大小 */ line-height: 1.2; /* 相對于當前字體大小的倍數 */ line-height: 24px; /* 直接指定像素值 */ line-height: 150%; /* 相對于父元素字體大小的百分比 */ line-height: inherit; /* 繼承父元素的行高 */
需要注意的是,如果把行高設置得太大或太小,會對網頁排版造成影響。因此,我們需要根據實際情況選擇合適的行高。
另外,行高也可以用來實現一些效果,比如豎向居中、文字間距等。下面是一些示例:
/* 豎向居中文本 */ .container { display: flex; align-items: center; /* 等同于align-items: stretch; */ } /* 調整文字間距 */ h1 { letter-spacing: 0.1em; line-height: 1.2; }
總之,掌握行高的用法能夠幫助我們更好地掌控網頁排版和樣式設計。
上一篇css中蘋方粗體
下一篇ajax中刷新本頁面刷新