Html and css | SoloLearn: Learn to code for FREE!

+5

Html and css

I want to change only second p tag color is yellow....What is the internal style css code for <div class="u"> <p>Hii</p> <p>Hello</p> </div> Without add any span tag and id tag inside that code...????????????

6/24/2020 4:31:03 AM

Cheliyan

6 Answers

New Answer

+3

You can give classname to the p tag which you want to be yellow and use p.class_name in css or you can do it by style attribute in particular p tag. For example. <p style="color:yellow">Hello</p> Or p. class_name { color:yellow; }

+2

#u p:nth-child(2) { color:yellow; } You can go this way.. or either div has only two p tags so #u p:last-child{ color:yellow; }

+2

the most specific selector we could write giving your code sample is: div.u > p:nth-child(2) { color: yellow; /* or background-color, depending on your needs ^^ */ } ...but you need to be more specific (impossible to guess without the parent structure of your snippet) if you have another <div class="u"> elsewhere in your code with a <p> direct 2nd child of it and you don't want to target it ;) instead of 'nth-child' selector you could use 'nth-of-type', but that will not avoid conflicts with other possible target: in such case being more specific requires maybe to give the full path from the <body> element... ie: body > div.myclassusedinmanydiv:nth-child(x) > div.u:nth-child(y) > p:nth-child(2)

0

Add a class to ur 2nd p and define the class differently or use inline css<p style="">hello</p>

0

div:nth-child(2){ // your code goes here }

-1

Just add class to your paragraph. <p class="style"> and then in css do .style{color:yellow;}