CSS Selector - How to use CSS begins with Selector [attribute^=value]








The [attribute^=value] selector selects elements whose attribute begins with value.

Summary

CSS Version
3

CSS Syntax

[attribute^=value] { 
   style properties 
}

Browser compatibility

[attribute^=value] Yes 7.0 Yes Yes Yes




Example

An example showing how to use [attribute^=value] CSS selector.

<!DOCTYPE html>
<html>
<head>
<style> 
div[class^="my_red"]
{<!--from ww w  .ja v  a 2 s.  co  m-->
   background:red;
}
</style>
</head>
<body>

<div class="my_red_test">div element.</div>
<p class="my_red">paragraph.</p>

</body>
</html>

Click to view the demo