CSS Tutorial

CSS Style

CSS Layout Style

CSS Float Style

CSS Reference

CSS attr Selector - CSS [attribute] Selector


What is CSS [att] Selector?

CSS [att] Selector matches all elements whose have attr attribute.
Attribute value whatever no concern only select matches attribute element.

Browser Compatibility

  • Google Chrome 2+
  • Mozilla Firefox 3+
  • Internet Explorer 9+
  • Opera 9.5+
  • Safari 1.3+

Note: Here details of browser compatibility with version number may be this is bug and not supported. But recommended to always use latest Web browser.

Syntax

This syntax apply to select element whose have attr attribute.

[attr] {
	property: value;
	property: value;
	...
}

Example:

Select all element whose have href attributes to apply CSS style.

<style type="text/css">
a[href] {
   color:#ff0000;
}
</style>
</head>
<body>
    <a href="http://www.google.com">Google</a>
    <a href="http://www.way2tutorial.com">Way2Tutorial</a>
    <a href="#">HTML</a>
</body>

Run it...   »

Example Result:

Example:

In this example select all element whose have class attribute.

<style type="text/css">
p[class] {
    color:#ff0000;
}
</style>
</head>
<body>
    <p class="one">This is first paragraph.</p>
    <p class="two">This is another paragraph.</p>
</body>

Run it...   »

Example Result:

This is first paragraph.

This is another paragraph.