CSS block-size 属性

主题

定义和用法

block-size是 CSS 逻辑属性之一，用于定义元素在块方向（block dimension）上的尺寸。

block-size与物理属性（如width/height）不同，逻辑属性根据文档的书写模式（writing mode）自动适应。

接下来通过多个实例演示block-size属性的用法，来深化您对block-size属性的理解。

在水平书写模式（如英语、中文）中，block-size相当于height。

实例代码运行代码

复制

.example {
    block-size: 200px;
}

在垂直书写模式（如日语纵排）中，block-size相当于width。

实例代码运行代码

复制

.example {
    block-size: 250px;
    writing-mode: vertical-rl;
}

block-size: auto|value|initial|inherit;

值	描述
`auto`	默认值，元素的默认块大小值。
`length`	以`px`、`pt`、`cm`等单位指定块大小值。参阅 CSS 单位。
`percentage`	以相对于父元素在对应轴上的大小的百分比指定块大小值。
`initial`	将此属性设置为其默认值。参阅 initial。
`inherit`	从其父元素继承此属性。参阅 inherit。

表中的数字指定了完全支持block-size属性的第一个浏览器版本。