forum

Home / DeveloperSection / Forums / CSS '>' selector; what is it?

Ask Question

CSS '>' selector; what is it?

Anonymous User215416-Apr-2013
Hi Everyone!

I have seen many time in css file greater than sign ">", but not understand why used it.
Please provide any suitable demo.

Please help me!

Thanks in advance!
css-css3css-css3 
Updated on 16-Apr-2013
Anonymous User

Anonymous User

Follow
I am a content writter !

Can you answer this question?

Answer

1 Answers

AVADHESH PATEL

AVADHESH PATEL

16-Apr-2013
Hi Ankita!

Greater than sign used for apply css on element

Syntax:

element > element

Example 
div > p
Apply on all <p> elements where the parent is a <div> element

Syntax

class > element

Example

.a > div

Apply on all <div> elements where the parent is a <div> with a class 

For example

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        .bg > div {
            background-color: #888888;
        }
        div > p {
            color: #600000;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
        <div id="red" class='bg' style="height: 150px; border: 2px solid #ff0000;">
            <div id="green" style="height: 60px; border: 2px solid #00ff00;">
                <p>Greater Than sign (>) CSS Selector demo</p>
            </div>
            <br />
            <div id="blue" style="height: 60px; border: 2px solid #0000ff;">
                <p>Greater Than sign (>) CSS Selector demo</p>
            </div>
        </div>
    </form>
</body>
</html>

From the above example, you can see "bg" class apply on "green","blue" div not on "red", and which <p> element inside on div that are selected.

Liked By