CSS Wildcard Selectors

CSS Wildcard Selectors are represented by various symbols such as *,^, or $. These selectors are used to select multiple elements simultaneously for applying CSS.

The attribute * selector

The [attribute*="val"] selector is used to select the elements whose attribute value contains the string ‘val’

syntax

[attribute*="value"]{
   //css property
}

The attribute ^ selector

The [attribute^="val"] selector used to select those elements whose attribute starts with a specified value ‘val’

[attribute^="value"]{
   //css property
}

The attribute $ selector

The [attribute$="val"] selector is used to select those elements whose attribute values ends with a specified with value ‘val’

[attribute$="value"]{
   //css property
}

example

See the Pen wildcard css by Arpit (@soniarpit) on CodePen.

Previous: CSS Media Queries

Next: CSS Gradients

Support CodeSnail

If you appreciate my work, or if it has helped you along your journey. It would mean a lot to me if you could write a message on my wall and share a cup of coffee (or tea) with me.

Buy Me A Coffee

Leave a Comment

Copy link
Powered by Social Snap