CSS | border-block-end-width 属性

简介

border-block-end-width 属性用于设置垂直方向上，视觉格式上边框的宽度，是 CSS 的一个边框属性。

语法

border-block-end-width: thin | medium | thick | <length> | <percentage>;

• thin：设置边框宽度为细边框，约为1像素。
• medium：设置边框宽度为中等边框，约为3像素。
• thick：设置边框宽度为粗边框，约为5像素。
• ：可以指定任意长度值，比如px、em、rem等。
• ：可以指定相对于父元素内容区域高度的百分比。

实例

<style>
  .box {
    width: 200px;
    height: 100px;
    padding: 20px;
    border-block-end-width: 5px;
    border-block-end-color: #333;
    border-block-end-style: solid;
  }
</style>

<div class="box">Hello, world!</div>

注意事项

• border-block-end-width 属性只会对元素的垂直边框生效，而水平边框的宽度需要使用 border-inline-end-width 属性。
• 如果同时设置了 border-block-start-width 和 border-block-end-width，则应用于元素的垂直边框的宽度就是二者之和。