Regular Expression to Match a Single CSS Property

Question

I currently have a large batch of HTML text and I have several CSS properties that resemble the following: ``` font:16px/normal Consolas; font:16px/normal Arial; font:12px/normal Courier; ``` which is also bundled with several other CSS properties and other associated HTML values and tags. I've been trying to write a regular expression that will only grab these "font styles", so if I had the following two paragraphs: ```

Stack

Overflow

Really large

``` it would only match the properties beginning with `font:` and ending with a semicolon `;`. I've played around using RegexHero and the closest I have gotten was: ``` \b(?:font[\s*\]*:[\s*\]*?(\b.*\b);) ``` which yielded the following results: ``` font:bold; //Match font:12pt/normal Arial; //Match font:16px/normal Consolas; //Match font:12pt/normal…

Accepted Answer

You've left the `.*` greedy, which means it will eat and eat and only stop at the last semicolon available. Add a question mark, i.e. `.*?` to make it non-greedy.

Updated:

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

I've tested every example on this page at http://rubular.com/r/yRcED2n6wu.

Regular Expression to Match a Single CSS Property

Solution

Problem