margin-block-start
Experimental: 这是一个实验中的功能
此功能某些浏览器尚在开发中,请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订,所以在未来版本的浏览器中该功能的语法和行为可能随之改变。
margin-block-start
CSS 属性定义了一个元素的逻辑块的开始边距,是用来根据元素的书写模式,方向和文本方向进行实际边界的衡量。
/* <length> values */
margin-block-start: 10px; /* 绝对长度 */
margin-block-start: 1em; /* 文本的相对大小 */
margin-block-start: 5%; /* 相对于最近块容器的大小 */
/* 关键字值 */
margin-block-start: auto;
/* 全局值 */
margin-block-start: inherit;
margin-block-start: initial;
margin-block-start: unset
margin-top
, margin-right
, margin-bottom
, or margin-left
属性对应于 writing-mode
, direction
, 和text-orientation
属性定义的值。
它涉及到 margin-block-end
(en-US), margin-inline-start
(en-US),和 margin-inline-end
(en-US)属性,这些属性是用来定义其它元素的边界。
Syntax
Values
margin-block-start
属性有着和 margin-left
属性一样的值。
Formal syntax
margin-block-start =
<'margin-top'>
案例
HTML Content
<div>
<p class="exampleText">Example text</p>
</div>
CSS Content
div {
background-color: yellow;
width: 120px;
height: 120px;
}
.exampleText {
writing-mode: vertical-lr;
margin-block-start: 20px;
background-color: #c8c800;
}
Specification
Specification | Status | Comment |
---|---|---|
CSS Logical Properties and Values Level 1 margin-block-start |
Editor's Draft | 初始定义 |
Browser compatibility
BCD tables only load in the browser
同样推荐
- 标记的物理属性:
margin-top
,margin-right
,margin-bottom
, andmargin-left
writing-mode
,direction
,text-orientation