CSS文章中line-height
时间：2023-04-02 22:59:25
HTML
的巧妙运用公司某页面中的一个样式如下，让左边的文字竖排，横竖居中：代码：暂停
。左山雀{宽度：30px；高度：158px；边界半径：5px005px；文本对齐：居中；字体大小：14px；颜色：#fff；字母间距：4px；-顶部：50px；padding-left:5px;}通常，我会使用padding（如上）或使用position+transform+margin使文本显示为垂直居中，但这不够聪明或多余。偶然发现，实际的line-height可以在不具体控制padding值，不加代码的情况下完美实现。改进后的代码如下：
Suspended .left-tit{width:30px;行高：158px；边界半径：5px005px；文本对齐：居中；字体大小：14px；颜色：#fff；背景：#eb5c5e;}.left-titspan{行高：1.2;显示：内联块；垂直对齐：中间；width:14px;}Main：设置外层line-height和内层span为inline-block；两点的结合真的很巧妙，line-height拉伸框的高度并保证文本垂直居中，inline-block使元素内联元素属性水平居中，同时具有属性块级元素来设置宽度。
