为什么border-image-width在border-image形式语法中出现两次？

Question

Here是W3C规范定义border-image属性的方式 Here是MDN如何解释border-image属性。

在两者中，形式语法是：

  

＆LT;＆＃39;边界图像源＆＃39;＆GT; || ＆LT;＆＃39;边界图像切片＆＃39;＆GT; [/   ＆LT;＆＃39;边界图像宽度＆＃39;＆GT; | /＆lt;＆＃;＆＃39; border-image-width＆＃39;＆gt;？ /   ＆LT;＆＃39;边界图像首先＆＃39;＆GT; ]？ || ＆LT;＆＃39;边界图像重复＆＃39;＆GT;

我了解||，|，?的含义。

为什么border-image-width在正式语法中出现两次？

Answer 1

让我们打破这一部分：

[ / <‘border-image-width’> | / <‘border-image-width’>? / <‘border-image-outset’> ]?

属性在括号内（[ ]）。这意味着他们是一个群体。

单栏（|）将该组划分为两个部分：

1. <‘border-image-width’>
2. <‘border-image-width’>? / <‘border-image-outset’>

单栏是回答问题的关键因素。

它将border-image-width定义为两个不同用例的一部分。它可以单独显示，也可以border-image-outset显示。根据单条定义，只能出现其中一种情况。

?之后和括号后的问号（border-image-width）表示它可以显示为零或一次。

所以这些是这个组的有效选项：

• border-image-width
• border-image-outset
• border-image-width＆amp; border-image-outset
• 没有

要真正理解为什么border-image-width需要两次，请尝试仅使用一个border-image-width复制这四个选项。