border-block

该CSS属性是一个简写属性在样式表一个单一的地方设置单独的逻辑块边界属性值。border-block

border-block: 1px;
border-block: 2px dotted;
border-block: medium dashed blue;

border-block can be used to set the values for one or more of border-block-width (en-US), border-block-style (en-US), and border-block-color (en-US) setting both the start and end in the block dimension at once. The physical borders to which it maps depends on the element's writing mode, directionality, and text orientation. It corresponds to the border-top and border-bottom or border-right, and border-left properties depending on the values defined for writing-mode, direction, and text-orientation.

Constituent properties

This property is a shorthand for the following CSS properties:

The border-block is specified with one or more of the following, in any order:

初始值	as each of the properties of the shorthand: `border-top-width`: `medium` `border-top-style`: `none` `border-top-color`: `currentcolor`
适用元素	all elements
是否是继承属性	否
计算值	as each of the properties of the shorthand: `border-top-width`: the absolute length or `0` if `border-top-style` is `none` or `hidden` `border-top-style`: as specified `border-top-color`: computed color
Animation type	discrete

border-block = 
  <'border-block-start'>

<div>
  <p class="exampleText">Example text</p>
</div>

div {
  background-color: yellow;
  width: 120px;
  height: 120px;
}

.exampleText {
  writing-mode: vertical-rl;
  border-block: 5px dashed blue;
}

Specification	Status	Comment
CSS Logical Properties and Values Level 1 border-block	Editor's Draft	初始定义

BCD tables only load in the browser