line-height-step
line-height-step
该line-height-stepCSS属性定义行框高度的阶梯单位。当步长单位为正时，线框高度向上舍入到最接近的单位倍数。负值无效。
/* Keyword values */
line-height-step: none;
/* Point values */
line-height-step: 18pt;
| Initial value | none |
|---|---|
| 应用对象 | block container elements |
| 是否可继承 | yes |
| 媒体 | visual |
| 计算值 | an absolute length; if the keyword none is specified, the computed value is 0 |
| 动画类型 | discrete |
| 规范顺序 | per grammar |
语法
line-height-step属性指定为下列任一项：
- 阿<length>
- 关键词
none...
值
none没有价值。<length>指定<length>用于计算直线盒的高度步长。
形式语法
none | <length>
实例
在下面的示例中，每个段落中的行框的高度被舍入到步进单元。线盒<h1>不适合于一个步骤单元，因此占据两个步骤单元，但它仍然集中在两个步骤单元内。
:root {
font-size: 12pt;
--my-grid: 18pt;
line-height-step: var(--my-grid
}
h1 {
font-size: 20pt;
margin-top: calc(2 * var(--my-grid)
}
这些规则的结果如下所示。
二次
规范
| Specification | Status | Comment |
|---|---|---|
| CSS Rhythmic SizingThe definition of 'line-height-step' in that specification. | Working Draft | Initial definition. |
浏览器兼容性
| Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
| Basic support | 59 | ? | ? | ? | 47 | ? |
| Feature | Android Webview | Chrome for Android | Edge | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|---|
| Basic support | 59 | 59 | ? | ? | ? | 47 | ? |
