Issue
I'm a beginner in studying CSS.
I want to make only child1 red.
as I know div is parents.
p and span.bbb is child combinators.
span.aaa is descendant combinators.
and then
A>B is to select child combinators.
A B is to select descendant combinators.
If I choose div>p, I thought it would be what I wanted.
But both child1 and descendant turned red.
Where am I wrong?
@charset "UTF-8";
div>p{
color:#f00;
}<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="VIEWPORT" content="width=device-width, initial-scale=1.0">
<tilte>combinators.html</title>
<link rel='stylesheet' href='combinators.css'>
</head>
<body>
<div>parents
<p>child1
<span class='aaa'>descendant
</span>
</p>
<span class='bbb'>child2
</span>
</div>
</body>
</html>Solution
Try
div>p:nth-child(1) { }
For more child css selectors check https://css-tricks.com/almanac/selectors/n/nth-child/
Answered By - Емил Цоков
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.