Attribute Selectors in CSS

You can also apply styles to HTML elements with particular attributes. The style rule below will match all the input elements having a type attribute with a value of text −

input[type = "text"]{
   color: #000000;
}

The following are the rules applied to attribute selector.

•  p[lang] - Selects all paragraph elements with a lang attribute.
•  p[lang="fr"] - Selects all paragraph elements whose lang attribute has a value of exactly "fr".
•  p[lang~="fr"] - Selects all paragraph elements whose lang attribute contains the word "fr".
•  p[lang|="en"] - Selects all paragraph elements whose lang attribute contains values that are exactly "en", or begin with "en-".

Lakshmi Srinivas

Published on 13-Apr-2018 07:19:31

• Related Questions & Answers
• Styling Forms with CSS Attribute Selectors
• Universal Selectors in CSS
• Type Selectors in CSS
• Descendent Selectors in CSS
• Class Selectors in CSS
• ID Selectors in CSS
• Group Selectors in CSS
• Child Selectors in CSS
• Descendant Selectors in CSS
• Grouping Selectors in CSS
• Advanced Selectors in CSS
• Selenium CSS Selectors Examples
• Adjacent Sibling Selectors in CSS
• General Sibling Selectors in CSS
• How to use OR Operation in jQuery Attribute Selectors?