Hacker Newsnew | past | comments | ask | show | jobs | submitlogin

I believe it could be usefull for CSS selectors[1]

The following rule will match for values of the "lang" attribute that begin with "en", including "en", "en-US", and "en-cockney":

    *[lang|="en"] { color : red }
So you may now be able to select with CSS elements with that syntax, for example matching all text-warning, text-info, text-center etc with just

    *[class|="text"] { font-weight: bold }
Correct me if I'm wrong.

I don't know if it would be practical or not. Other than that it just a matter of preference, CSS classes tends to be generally separated by dashes from my point of view, whether I prefer Camel Case or not.

[1]: http://www.w3.org/TR/CSS2/selector.html#attribute-selectors



[*class|="text"] will also matched textWarning, textInfo, textCenter, etc.


Seems strange to me since the spec says the following:

Represents an element with the att attribute, its value either being exactly "val" or beginning with "val" immediately followed by "-" (U+002D).

it should match text-foo or text but not textFoo


You are correct, that selector would not match textFoo. It is the same as [class^=text-]. The real problem with using these attribute selectors with classes is that they only apply to the first class in the class list. If your element was something like "<p class='content text-foo'>", then it would not be matched by that selector.




Consider applying for YC's Fall 2026 batch! Applications are open till July 27.

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: