Mfano wa CSS border-block-end-width

定义和用法

border-block-end-width 属性设置元素在块方向末端的边框宽度。

注意:要使 border-block-end-width 属性生效,必须设置 border-block-end-style 属性。

CSS border-block-end-width 属性与 border-bottom-widthborder-left-widthborder-right-widthborder-top-width 属性非常相似,但 border-block-end-width 属性依赖于块方向。

注意:相关的 CSS 属性 writing-mode 定义了块方向。这会影响块的起点和终点位置以及 border-block-end-width 属性的结果。对于英文页面,行内方向是从左到右,块方向是向下。

实例

例子 1

设置块方向末端的边框宽度:

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

亲自试一试

例子 2:结合 writing-mode 属性

块方向末端边框宽度的位置受 writing-mode 属性的影响:

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

亲自试一试

CSS 语法

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

属性值

描述
medium 指定中等宽度边框。默认值。
thin 指定细边框。
thick 指定粗边框。
length 允许您定义边框的厚度。请参阅:Mafaa ya Kifungu cha CSS ya Sanaa.
initial Inasaidia kufikiria tabia hii kwa kutumia mwako wa kuzalishwa. Angalia: initial.
inherit Inakusaidia kumpa tabia hii kwa kutumia kina ya mbinguni kutoka kwa kina ya baba. Angalia: inherit.

Mafanikio ya kidhamira

Mwako: medium
Mashirika: Hapendekezi
Mafuta ya hali ya huzuni: Inafaa kuangalia:Mafanikio ya mafuta ya hali ya huzuni.
Safarini: CSS3
Inayotumiwa na Kiingilizi: object.style.borderBlockEndWidth="10px"

Mafanikio ya kifungu

Mafanikio ya jumla kwenye tabia hizi ni barua ya kwanza ya kufaa kwa kusoma tabia hizi.

Chrome Edge Firefox Safari Opera
69.0 79.0 41.0 12.1 56.0

Mawasiliano ya kati

Mafunzo:Kifungu cha CSS

Tazama:Mfano wa CSS border

Tazama:Mfano wa CSS border-block

Tazama:Mfano wa CSS border-block-end

Tazama:Mfano wa CSS border-block-end-style

Tazama:Mfano wa CSS border-block-start-width

Tazama:Mfano wa CSS border-bottom-width

Tazama:Mwongozo wa CSS border-left-width

Tazama:Mwongozo wa CSS border-right-width

Tazama:Mwongozo wa CSS border-top-width

Tazama:Mwili wa writing-mode katika CSS