6

我想将 CSS 中的边框属性拆分为其组成部分，即：

.someClass{
  border: 1px solid black;
}

进入

border-width: 1px
border-style: solid;
border-color: black;

在此之前我已经拆分了边框：和分号，所以我只需要解析属性的值部分

现在在 CSS 中，您可以使用上述 3 个属性的任意组合，因此

border: 1px solid;
border: solid Gold;
border: 1em;
border: 1mm #000000;
border: 1px inset rgb(12, 44, 199);

一切都是合法的，所以我需要说明这一点。

到目前为止我所拥有的是

([0-9]+[a-zA-Z|%]+)* *([a-zA-Z]*) *( .*)

这在正常情况下工作正常，但在“1px Solid”情况下失败，因为 Solid 被放入第三个捕获组，而不是第二个。我不是正则表达式专家，所以我可能会犯非常基本的错误，但任何帮助将不胜感激。我正在使用 C#（但主要是在http://gskinner.com/RegExr/中进行测试，所以任何差异都可能是问题所在）

4

1 回答 1

1

简单地包括border:在表达式的开头似乎是一个主要的帮助，因为它不会意外地匹配第二或第三组。同样，添加;到表达式的末尾可以防止过早捕获第二组或第三组。除此之外，将第二组从更改*为+也有帮助，因为这允许它按预期匹配第二组而不是第三组。总而言之，试试这个：

border: ([0-9]+[a-zA-Z|%]+)* *([a-zA-Z]+)* *( .*)*;

我怀疑这是否完美，如果您需要 100% 的结果，您可能不应该使用单个正则表达式，而是标记并解析字符串（我非常怀疑 CSS 规则完全用正则表达式解析），但如果这适用于您需要的有限规则非常好。

于 2013-02-05T23:25:01.507 回答