CSS Attribute Selectors
Style HTML Elements With Specific Attributes
It is possible to style HTML elements that have specific attributes, not just
class and id.
Note: Internet Explorer 7 (and higher) supports attribute selectors
only if a !DOCTYPE is specified. Attribute selection is NOT supported in IE6 and lower.
Attribute Selector
The example below styles all elements with a title attribute:
Attribute and Value Selector
The example below styles all elements with title="W3Schools":
Attribute and Value Selector - Multiple Values
The example below styles all elements with a title attribute that contains a
specified value. This works even if the attribute has space separated values:
The example below styles all elements with a lang attribute that contains a
specified value. This works even if the attribute has hyphen ( - ) separated values:
Styling Forms
The attribute selectors are particularly useful for styling forms without
class or ID:
Example
input[type="text"]
{
width:150px;
display:block;
margin-bottom:10px;
background-color:yellow;
}
input[type="button"]
{
width:120px;
margin-left:35px;
display:block;
} |
Try it yourself »
|
Create a free Flash website with our simple, online web design editing platform. Stunning templates
and user-friendly tools make website building easy and fun.
Start Creating your free website now!
The Altova MissionKit is an integrated suite of tools ideal for:
- XML development
- Web & Web services development
- Data mapping & integration
- Rendering & publishing XML & database data
- XBRL validation, taxonomy editing, transformation & rendering
The MissionKit for XML Developers includes XMLSpy® - the industry-leading XML editor; MapForce® - a
graphical data mapping, conversion, and integration tool; StyleVision® - a visual XSLT stylesheet designer;
DiffDog® - an XML-aware diff/merge tool; and 2 additional tools.
Try all 6 products free for 30 days!
Download a fully-functional free trial
|
|
|
| 
