CODEWITHSUNDEEP
htmlcss
Software Architecture
Software Architecture

Reputation: 137

Styling of first label within a tag

I want to style the first label in <p> tag.

I want first label font size 20px while 2nd label size 10px. I know by using ids and classess. But I want like

p->first:label

Thanks in advance.

Upvotes: 1

Views: 76

Answers (4)

4dgaurav
4dgaurav

Reputation: 11496

Demo

I suggest to use nth-of-type()

Read here for more details

html

<p>
    <label>this is a label</label>
    <label>this is a label</label>
    <label>this is a label</label>
    <label>this is a label</label>
</p>

css

p label:nth-of-type(1) {
    color: red;
}

Upvotes: 0

user3890410
user3890410

Reputation: 1

Might be better to actually use :first-of-type, so:

p > label { font-size: 10px; }
p > label:first-of-type { font-size: 20px; }

Upvotes: 0

Nikesh Ponnen
Nikesh Ponnen

Reputation: 409

p label { font-size:10px;}
p label:first-child { font-size:20px;}

Upvotes: 2

Suresh Ponnukalai
Suresh Ponnukalai

Reputation: 13978

you can use first-child

p label:first-child
{
 /* your style */
}

Upvotes: 0

Related Questions