CSS ボーダーブロックエンド幅属性

定義と使用法

border-block-end-width 属性を設定して、要素のブロック方向末端のボーダー幅を定義します。

注意：を使用して、 border-block-end-width 属性が生效するには、 border-block-end-style 属性と

CSS border-block-end-width 属性は border-bottom-width、border-left-width、border-right-width および border-top-width 属性は非常に似ていますが、 border-block-end-width 属性はブロック方向に依存しています。

注意：関連する CSS 属性 writing-mode ブロック方向を定義します。これはブロックの起点と終点の位置に影響を与え、 border-block-end-width 属性の結果。英語のページでは、インライン方向は左から右、ブロック方向は下向きです。

ブロック方向末端のボーダー幅を設定する：

div {
  border-block-end-style: solid;
  border-block-end-width: 10px;
}

ブロック方向末端のボーダー幅の位置は、 writing-mode 属性の影響：

div {
  border-block-end-style: solid;
  writing-mode: vertical-rl;
  border-block-end-width: 5px;
}

border-block-end-width: medium|thin|thick|length|initial|inherit;

値	説明
medium	中程度の幅のボーダーを指定します。デフォルト値。
thin	細いボーダーを指定します。
thick	太いボーダーを指定します。
length	あなたに、ボーダーの厚みを定義することができます。参照してください：CSS 単位。
initial	この属性をデフォルト値に設定します。参照してください： initial。
inherit	この属性は、親要素から継承されます。参照してください： inherit。

デフォルト値：	medium
継承性：	いいえ
アニメーション作成：	サポート。参照してください：アニメーション関連属性。
バージョン：	CSS3
JavaScript 言語：	object.style.borderBlockEndWidth="10px"

テーブルの数字は、この属性を完全にサポートする最初のブラウザのバージョンを示しています。

Chrome	Edge	Firefox	Safari	Opera
69.0	79.0	41.0	12.1	56.0