6

CSS からボーダー属性をその構成要素に分割したい。

.someClass{
  border: 1px solid black;
}

の中へ

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

この前に border: とセミコロンを分割したので、属性の値セクションを解析するだけで済みます。

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 ソリッド」の場合は失敗します。これは、ソリッドが 2 番目ではなく 3 番目のキャプチャ グループに配置されるためです。私は正規表現の専門家ではないので、非常に基本的な間違いを犯している可能性がありますが、どんな助けでも大歓迎です。私はC＃で作業しています（ただし、主にhttp://gskinner.com/RegExr/でテストしているため、違いが問題になる可能性があります）

4

1 に答える 1

1

border:2 番目または 3 番目のグループと誤って一致することがないため、式の先頭に含めるだけで大​​きな助けになるようです。同様に;、式の最後に追加すると、2 番目または 3 番目のグループのキャプチャが早すぎるのを防ぐことができます。それ以外に、2 番目のグループを から*に変更する+ことも役立ちます。全体として、これを試してください：

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

これが完璧であるとは思えません。100% 機能するために結果が必要な場合は、単一の正規表現を使用するのではなく、文字列をトークン化して解析する必要があります (CSS ルールが完全に正規表現で解析されるとは思えません)。あなたがそれを必要とする限られたルールは素晴らしいです。

于 2013-02-05T23:25:01.507 に答える