CSS [attribute^=value] Selector
The [attribute^=value] selector is used to select those elements whose attribute value begins with a given attribute.
Syntax:
[attribute^=value] { // CSS Property }
Example: In this example, The CSS selector p[class^=”for”] targets <p> elements with a class attribute that starts with “for” and applies a green background color and white text color.
html
<!DOCTYPE html> < html > < head > < title > CSS [attribute^="value"] Selector </ title > <!-- CSS property --> < style > p[class^="for"] { background: green; color: white; } </ style > </ head > < body > < h2 >[attribute^=value] Selector</ h2 > < p class = "w3wiki" >w3wiki</ p > < p class = "forBeginner" >A computer science portal</ p > < p class = "Beginner" >Sudo GATE</ p > < p class = "for" >Sudo placement</ p > </ body > </ html > |
Output:
Supported Browsers: The browser supported by [attribute^=value] selectors are listed below:
- Google Chrome 4.0
- Internet Explorer 7.0
- Firefox 3.5
- Safari 3.2
- Opera 9.6
Contact Us