Question

我目前有一大批HTML文本，我有几个类似于以下内容的CSS属性：

font:16px/normal Consolas;
font:16px/normal Arial;
font:12px/normal Courier;

还捆绑了其他几个CSS属性和其他相关的HTML值和标记。

我一直在尝试编写一个只捕获这些“字体样式”的正则表达式，所以如果我有以下两段：

<p style='font:16px/normal Arial; font-weight: x; color: y;'>Stack</p>
<span style='color: z; font:16px/normal Courier;'>Overflow</span>
<br />
<div style='font-family: Segoe UI; font-size: xx-large;'>Really large</div>

它只匹配以font:开头并以分号;结尾的属性。

我使用RegexHero玩过，我得到的最接近的是：

\b(?:font[\s*\\]*:[\s*\\]*?(\b.*\b);)

产生了以下结果：

font:bold;                   //Match
font:12pt/normal Arial;      //Match
font:16px/normal Consolas;   //Match
font:12pt/normal Arial;      //Match
property: value;             //Not a Match
property: value value value; //Not a Match

但是当我试图放入一大块HTML时，事情似乎变得混乱，选择了大块而不是之前指定的范围。

我很乐意提供任何其他信息和测试数据。

Answer 1

试试这个

\b((?:font:[^;]*?)(?:;|'))

<强>解释

\b             # Assert position at a word boundary
(              # Match the regular expression below and capture its match into backreference number 1
   (?:            # Match the regular expression below
      font:          # Match the characters “font:” literally
      [^;]           # Match any character that is NOT a “;”
         *?             # Between zero and unlimited times, as few times as possible, expanding as needed (lazy)
   )
   (?:            # Match the regular expression below
                     # Match either the regular expression below (attempting the next alternative only if this one fails)
         ;              # Match the character “;” literally
      |              # Or match regular expression number 2 below (the entire group fails if this one fails to match)
         &apos;              # Match the character “&apos;” literally
   )
)

Answer 2

你已离开.*贪婪，这意味着它会吃饱吃掉，只停留在最后一个分号上。添加问号，即.*?，使其不贪婪。

<强>更新

    \b(?:font\s*?:\s*([^;>]*?)(?=[;">}]))

我已在http://rubular.com/r/yRcED2n6wu测试此页面上的每个示例。

Answer 3

试试这个RegEx：

(?:font:[^;]*);

它匹配上面代码段中的font:16px/normal Arial;和font:16px/normal Courier;。

Answer 4

我建议：

\bfont\s*:\s*([^;}"'<>]+)(?<=\S)

这也适用于其他答案失败的情况。例如：

.foo { font: sans-serif 80% }
... style="font: sans-serif 80%" ...

Answer 5

我不太确定你在问什么，但我认为这个问题可以通过用CSS替换你的样式标签来解决。可以通过将以下内容放在HTML的Head标记中来解决此问题。

<style type="text/css">

h1 {

    font-family: Arial;
    font-size: 15;
    font-style:oblique;

}

h2 {
    font-family: Courier;
    font-size: 16;
    font-style:oblique;
 }
 h3 {
    font-family: Segoe UI;
    font-size: xx-large;
    font-style:oblique;
 }


</style>

现在，要让表达式（或你自己）设置其中一种字体样式，你需要做的就是用这样的标签包围它：

<h1> Cool Text!  </h1>

祝你好运！

正则表达式匹配单个CSS属性

5 个答案: