Question

I’m trying to find a regular expression that will let me extract JUST the rules from a CSS file. I don’t want any of the style declarations, simply the rules (selectors). Here’s the sample CSS file I’m working with:

body, p, table, td, th, br, div, span {
    /* Some styles here */
}

/* This is a test */
h1 {
    /* Some styles here */
}

a:hover {
    /* Some styles here */
}

-moz-any(input[type="text"], input[type="radio"]) {
    /* Some styles here */
}

In this example I would expect my regular expression to match the following items: body, p, table, td, th, br, div, span, h1, a:hover, -moz-any(input[type=”text”], input[type=”radio”])

Here’s my attempt at the regular expression. While it works, it includes the /* This is a test */ comment and it also includes the curly braces. Ideally those would be omitted.

(}{0,})([^}]*)({)

Any help with this would be greatly appreciated. Many thanks in advance!

I should also note that I understand this isn’t a great CSS file. It’s simply a test file I came up with to test my parsing with.

Answer 1

I was not able to get a solution using RegEx, so I followed Qtax’s advice and used a proper parser with CSS3 grammar.

I am marking this question as the answer.

@Qtax – If you add your comment as an answer, I’ll mark that as the “correct” answer 🙂