Skip to content
Related Articles

Related Articles

Improve Article
Save Article
Like Article

What is greater-than sign (>) selector in CSS?

  • Last Updated : 30 Jul, 2021

The greater than sign (>) selector in CSS is used to select the element with a specific parent. It is called as element > element selector. It is also known as the child combinator selector which means that it selects only those elements which are direct children of a parent. It looks only one level down the markup structure and not further deep down. Elements which are not the direct child of the specified parent is not selected.

Syntax:

element > element {
    // CSS Property
}

Example-1: This example describes the greater than > selector.




<!DOCTYPE html> 
<html
    <head
        <title
            CSS element > element Selector 
        </title
        <style
            ul > li { 
                color:white; 
                background: green; 
            
        </style
    </head
    <body
        <h2 style = "color:green;"
            CSS element > element Selector 
        </h2
          
        <div>Searching algorithms</div
          
        <ul
            <li>Binary search</li
            <li>Linear search</li
        </ul
          
        <p>Sorting Algorithms</p
        <ul
            <li>Merge sort</li
            <li>Quick sort</li
        </ul
    </body
</html

Output:

Example 2: This example describes the greater than > selector.




<!DOCTYPE html> 
<html
    <head
        <title
            CSS element > element Selector 
        </title
          
        <!-- style to set element > element selector -->
        <style
            li > div { 
                color:white; 
                background: green; 
            
            ul > li {
                color: green;
            }
        </style
    </head
      
    <body
        <h2 style = "color:green;"
            CSS element > element Selector 
        </h2
          
        <ul>
            <li>
                <div>Searching algorithms</div
          
                <ul
                    <li>Binary search</li
                    <li>Linear search</li
                </ul>
            </li
          
            <li>
                <div>Sorting Algorithms</div
                <ul
                    <li>Merge sort</li
                    <li>Quick sort</li
                </ul>
            </li>
        </ul>
    </body
</html

Output:

CSS is the foundation of webpages, is used for webpage development by styling websites and web apps.You can learn CSS from the ground up by following this CSS Tutorial and CSS Examples.


My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!