25 C
New York
Sunday, June 22, 2025

Buy now

spot_img

Case Insensitive CSS Attribute Selector


CSS selectors by no means stop to amaze me in how highly effective they are often in matching complicated patterns. Most of that flexibility is in mother or father/youngster/sibling relationships, very seldomly in worth matching. Take into account my shock after I discovered that CSS permits matching attribute values regardless off case!

Including a {house}i to the attribute selector brackets will make the attribute worth search case insensitive:

/* case delicate, solely matches "instance" */
[class=example] {
  background: pink;
}

/* case insensitive, matches "instance", "eXampLe", and so on. */
[class=example i] {
  background: lightblue;
}

The use circumstances for this i flag are possible very restricted, particularly if this flag is knew information for you and also you’re used to a normal lower-case customary. A unfastened CSS classname customary can have and would proceed to result in issues, so use this case insensitivity flag sparingly!

  • 39 Shirts – Leaving Mozilla

    In 2001 I had simply graduated from a small city highschool and headed off to a small city school. I discovered myself within the quaint pc lab the place the substandard computer systems featured two browsers: Web Explorer and Mozilla. It was this lab the place I fell…

  • CSS Animations Between Media Queries

    CSS animations are proper up there with sliced bread. CSS animations are environment friendly as a result of they are often {hardware} accelerated, they require no JavaScript overhead, and they’re composed of little or no CSS code. Very often we add CSS transforms to parts through CSS throughout…

  • Dynamically Load Stylesheets Using MooTools 1.2

    Theming has develop into a giant a part of the Internet 2.0 revolution. Fortunately, so too has the next regard for semantics and CSS requirements. For those who construct your pages utilizing good XHTML code, altering a CSS file could make your web site look utterly completely different.

  • Font Replacement Using Cufón

Related Articles

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Stay Connected

0FansLike
0FollowersFollow
0SubscribersSubscribe
- Advertisement -spot_img

Latest Articles