Open In App
Related Articles

CSS [attribute^=value] Selector

Improve Article
Save Article
Like Article

The [attribute^=value] selector is used to select those elements whose attribute value begins with a given attribute.


[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.


<!DOCTYPE html>
        CSS [attribute^="value"] Selector
    <!-- CSS property -->
        p[class^="for"] {
            background: green;
            color: white;
    <h2>[attribute^=value] Selector</h2>
    <p class="GeeksforGeeks">GeeksforGeeks</p>
    <p class="forGeeks">A computer science portal</p>
    <p class="Geeks">Sudo GATE</p>
    <p class="for">Sudo placement</p>


CSS attribute Selector example output gfg

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
Whether you're preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, GeeksforGeeks Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we've already empowered, and we're here to do the same for you. Don't miss out - check it out now!

Last Updated : 04 Jul, 2023
Like Article
Save Article
Similar Reads
Complete Tutorials