How to select via regex all class notations in css file


Tags: css,regex

Problem :

By having a css file with css rules, I'd like to select only css class (i.e.) .tblGenFixed but not css values for a rule (i.e.) opacity: 0.3 .

This is my regex: /(\.([\w_]+))/g

This is my alternative solution but it doesn't work /(?!\{)(\.([\w_]+))(?!\})/g

I have set an example in regex101 here https://regex101.com/r/gG4nN4/1

How can I ignore css rule values ?



Solution :

See this : Which characters are valid in CSS class names/selectors?

A value will have a digit after the dot. Luckily, valid CSS class names cannot start with a digit :)

Your regexp has to match a dot first, then a letter or - or _

! if you look for whitespace before the dot, a value like .5 will match ...

Try this one : (\.([a-zA-Z_-]{1}[\w-_]+))

Edit :

See this too : Regex to match a CSS class name

-?[_a-zA-Z]+[_a-zA-Z0-9-]*

Relevant quote :

Basically, a name must begin with an underscore (_), a hyphen (-), or a letter(a–z), followed by any number of hyphens, underscores, letters, or numbers. There is a catch: if the first character is a hyphen, the second character must be a letter or underscore, and the name must be at least 2 characters long.


    CSS Howto..

    How do I make a table show a vertical scroll bar without explicitly setting the height?

    How to give css sprites effect?

    Fixing my CSS: How to get the lists and titles to work?

    How do I customize the rdoc Darkfish stylesheet?

    How can I get an image to always appear to the right of some associated text using HTML and/or CSS?

    How can I alter this CSS so that it only applies to a certain div?

    How to make div covers divs on hover?

    How can I attach a method to an object to change CSS

    CSS How to create a container with non-linear borders

    How can I set the System.Web.Optimization bundler to correctly transform ISO unicode

    Javafx CSS How to inherit background color from other css settings

    How to move text list items to align with an image list item

    How to make CSS animation happen the moment the website loads

    How to set background-color to the length of the test in a jQuery UI accordion?

    How to stop a hovered list item's text from changing back to default when hovering over subnav

    How to make a 3D banner overlay (??) with CSS

    How can I vertical align my
  • to the top of this box which uses `display: flex`?
  • How to make a full width sub-menu [closed]

    How to auto-resize tabs to fit a fixed-width container?

    How to apply css to html so that it shows as the style property

    How can a transformed Image transition back to it's original shape when hovered?

    Ruby on rails dropdown