DEV Community

Cover image for Css Selectors By Attribute with 3 Examples
Shan Asif
Shan Asif

Posted on • Edited on

1

Css Selectors By Attribute with 3 Examples

What is an Attribute selector in CSS?

An attribute selector matches a tag based on the value of its attribute. In other words, it's used to select elements that have a particular attribute.

Understand Css Selectors By Attribute with examples:

Example # 1:

Select all the elements with an href matching "example.org"

a[href="example.org"] {...}

Example # 2:

Select elements with an href containing "example"

a[href*="example"] {... }

Example # 3:

Elements that have been set to display: none or visibility='hidden' by default

a[visibility=hidden] {...}

Don't stop here! I have another great guide for you.

You can now read our CSS Selectors cheat sheet for free

Learning CSS box-shadows could be difficult?

Css Selectors By Attribute with 3 Examples

You do not need to worry at all.

Because I have also created a complete 101 guide about CSS box-shadow with several different real-world examples and output.

You will definitely love it.

Don't forget to follow my profile here for more cool & instant stuff in web development.

Best of luck!

Sentry image

Hands-on debugging session: instrument, monitor, and fix

Join Lazar for a hands-on session where you’ll build it, break it, debug it, and fix it. You’ll set up Sentry, track errors, use Session Replay and Tracing, and leverage some good ol’ AI to find and fix issues fast.

RSVP here →

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay