How to apply css to a <p> tag inside <div> tag with CSS and HTML

4 Answers

0 votes
<!DOCTYPE html>
<html>
<head>
<style>
.div-p div:nth-child(1) p{color:blue;}
</style>
</head>
<body>

<div class="div-p">
    <div>
        <p>div p style</p>  
    </div>
</div>

</body>
</html>

 



answered Jul 31, 2018 by avibootz
0 votes
<!DOCTYPE html>
<html>
<head>
<style>
.div-p div:nth-child(1) p{color:blue;}
.div-p div:nth-child(2) p{color:green;}
.div-p div:nth-child(3) p{color:red;}
</style>
</head>
<body>

<div class="div-p">
    <div>
        <p>div p style 1</p>  
    </div>    
    <div>
        <p>div p style 2</p>  
    </div>    
    <div>
        <p>div p style 3</p>  
    </div>
</div>

</body>
</html>

 



answered Jul 31, 2018 by avibootz
0 votes
<!DOCTYPE html>
<html>
<head>
<style>
.div-p > div > p {
    color: green;
}
</style>
</head>
<body>

<div class="div-p">
    <div>
        <p>div p style 1</p>  
    </div>    
    <div>
        <p>div p style 2</p>  
    </div>    
    <div>
        <p>div p style 3</p>  
    </div>
</div>

</body>
</html>

 



answered Jul 31, 2018 by avibootz
0 votes
<!DOCTYPE html>
<html>
<head>
<style>
.div-p div:nth-child(2) p{color:green;}
</style>
</head>
<body>
 
<div class="div-p">
    <div>
        <p>div p style 1</p>  
    </div>    
    <div>
        <p>div p style 2</p>  
    </div>    
    <div>
        <p>div p style 3</p>  
    </div>
</div>
 
</body>
</html>

 



answered Jul 31, 2018 by avibootz

Related questions

1 answer 202 views
1 answer 174 views
174 views asked Dec 18, 2018 by avibootz
2 answers 252 views
1 answer 196 views
2 answers 262 views
2 answers 255 views
2 answers 265 views
...