CSS Selectors: Practice Questions
HTML 1
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Summit Snack Club</title>
</head>
<body>
<div id="header">
<img src="top-image.png" alt="Sunrise over the ridge">
</div>
<h1 id="top">Summit <span class="bold">Snack Club</span></h1>
<p>
<span class="italic">Saturday: Switchback Ridge.</span>
Meet before sunrise. Bring water and your finest trail mix.
</p>
<blockquote>
<span class="bold">Trail rule:</span>
Whoever says "almost there" has to carry the snacks.
</blockquote>
<p>
<a href="https://www.rtealwitter.com">Meet our trip leader</a>,
whose route descriptions include "mostly uphill."
</p>
<br>
<a href="https://www.rtealwitter.com">
<img src="bottom-image.png" alt="The club at the summit">
</a>
</body>
</html>Question 1
Use the HTML 1 above.
How many HTML tags does the CSS selector p select in the page above?
Answer
2Question 2
Use the HTML 1 above.
How many HTML tags does the CSS selector .bold select in the page above?
Answer
2Question 3
Use the HTML 1 above.
How many HTML tags does the CSS selector p.bold select in the page above?
Answer
0Question 4
Use the HTML 1 above.
How many HTML tags does the CSS selector p .bold select in the page above?
Answer
0Question 5
Use the HTML 1 above.
How many HTML tags does the CSS selector p, .bold select in the page above?
Answer
4Question 6
Use the HTML 1 above.
How many HTML tags does the CSS selector #top select in the page above?
Answer
1Question 7
Use the HTML 1 above.
How many HTML tags does the CSS selector h1#top select in the page above?
Answer
1Question 8
Use the HTML 1 above.
How many HTML tags does the CSS selector div#top select in the page above?
Answer
0Question 9
Use the HTML 1 above.
How many HTML tags does the CSS selector img#header select in the page above?
Answer
0Question 10
Use the HTML 1 above.
How many HTML tags does the CSS selector #header, #top select in the page above?
Answer
2Question 11
Use the HTML 1 above.
How many HTML tags does the CSS selector h1 p select in the page above?
Answer
0Question 12
Use the HTML 1 above.
How many HTML tags does the CSS selector h1 span select in the page above?
Answer
1Question 13
Use the HTML 1 above.
How many HTML tags does the CSS selector li span select in the page above?
Answer
0Question 14
Use the HTML 1 above.
How many HTML tags does the CSS selector body span select in the page above?
Answer
3Question 15
Use the HTML 1 above.
How many HTML tags does the CSS selector body > span select in the page above?
Answer
0Question 16
Use the HTML 1 above.
How many HTML tags does the CSS selector h1 > span select in the page above?
Answer
1Question 17
Use the HTML 1 above.
How many HTML tags does the CSS selector h1 + p select in the page above?
Answer
1Question 18
Use the HTML 1 above.
How many HTML tags does the CSS selector p + h1 select in the page above?
Answer
0Question 19
Use the HTML 1 above.
How many HTML tags does the CSS selector h1 + span select in the page above?
Answer
0Question 20
Use the HTML 1 above.
How many HTML tags does the CSS selector h1 ~ p select in the page above?
Answer
2Question 21
Use the HTML 1 above.
How many HTML tags does the CSS selector p ~ h1 select in the page above?
Answer
0Question 22
Use the HTML 1 above.
How many HTML tags does the CSS selector h1 ~ span select in the page above?
Answer
0Question 23
Use the HTML 1 above.
How many HTML tags does the CSS selector p ~ p select in the page above?
Answer
1Question 24
Use the HTML 1 above.
How many HTML tags does the CSS selector p + p select in the page above?
Answer
0Question 25
Use the HTML 1 above.
How many HTML tags does the CSS selector [src="top-image.png"] select in the page above?
Answer
1Question 26
Use the HTML 1 above.
How many HTML tags does the CSS selector [src="https://www.rtealwitter.com"] select in the page above?
Answer
0Question 27
Use the HTML 1 above.
How many HTML tags does the CSS selector [class="bold"] select in the page above?
Answer
2Question 28
Use the HTML 1 above.
How many HTML tags does the CSS selector a[class="bold"] select in the page above?
Answer
0Question 29
Use the HTML 1 above.
How many HTML tags does the CSS selector a[href="https://www.rtealwitter.com"] select in the page above?
Answer
2Question 30
Use the HTML 1 above.
How many HTML tags does the CSS selector h1 ~ * select in the page above?
Answer
5Question 31
Use the HTML 1 above.
How many HTML tags does the CSS selector h1 ~ p > span select in the page above?
Answer
1Question 32
Use the HTML 1 above.
How many HTML tags does the CSS selector h1 ~ p > span, a[href="https://www.rtealwitter.com"] select in the page above?
Answer
3Question 33
Use the HTML 1 above.
How many HTML tags does the CSS selector blockquote ~ *, span, p.bold select in the page above?
Answer
6Question 34
Use the HTML 1 above.
How many HTML tags does the CSS selector * > span, img select in the page above?
Answer
5HTML 2
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Caesar's Crag Climbing Club</title>
</head>
<body>
<div id="header">
<h1 id="top">Caesar's <span class="bold">Crag</span></h1>
<img src="top-image.png" alt="The climbing wall">
</div>
<div id="body">
<h2>The Crag Report</h2>
<p class="bold">
Today's challenge: Caesar Salad, a route with
suspiciously small footholds.
</p>
<p class="bold">
The holds are colorful. Our excuses are more colorful.
</p>
<h2>Three Moves, Twelve Attempts</h2>
<ol>
<li>
<img class="bold" src="caesar.png"
alt="Caesar Salad route">
</li>
<li class="bold"><em>Find the tiny foothold.</em></li>
<li class="bold"><em>Try the move one more time.</em></li>
<li class="bold"><em>Celebrate with a snack.</em></li>
</ol>
</div>
</body>
</html>Question 35
Use the HTML 2 above.
How many HTML tags does the CSS selector li select in the page above?
Answer
4Question 36
Use the HTML 2 above.
How many HTML tags does the CSS selector .bold select in the page above?
Answer
7Question 37
Use the HTML 2 above.
How many HTML tags does the CSS selector li.bold select in the page above?
Answer
3Question 38
Use the HTML 2 above.
How many HTML tags does the CSS selector li .bold select in the page above?
Answer
1Question 39
Use the HTML 2 above.
How many HTML tags does the CSS selector h2 + p select in the page above?
Answer
1Question 40
Use the HTML 2 above.
How many HTML tags does the CSS selector div > .bold select in the page above?
Answer
2Question 41
Use the HTML 2 above.
How many HTML tags does the CSS selector #body img select in the page above?
Answer
1Question 42
Use the HTML 2 above.
How many HTML tags does the CSS selector h1 div select in the page above?
Answer
0Question 43
Use the HTML 2 above.
How many HTML tags does the CSS selector h2 + li select in the page above?
Answer
0Question 44
Use the HTML 2 above.
How many HTML tags does the CSS selector img ~ li > em select in the page above?
Answer
0Question 45
Use the HTML 2 above.
How many HTML tags does the CSS selector #header > h1 ~ * select in the page above?
Answer
1Question 46
Use the HTML 2 above.
How many HTML tags does the CSS selector #body > * em select in the page above?
Answer
3Question 47
Use the HTML 2 above.
How many HTML tags does the CSS selector #body * em select in the page above?
Answer
3Question 48
Use the HTML 2 above.
How many HTML tags does the CSS selector #body * select in the page above?
Answer
13Question 49
Use the HTML 2 above.
How many HTML tags does the CSS selector .body .bold select in the page above?
Answer
0Question 50
Use the HTML 2 above.
How many HTML tags does the CSS selector ol em select in the page above?
Answer
3Question 51
Use the HTML 2 above.
How many HTML tags does the CSS selector ol > em select in the page above?
Answer
0Question 52
Use the HTML 2 above.
How many HTML tags does the CSS selector [src="caesar.png"] ~ * select in the page above?
Answer
0Question 53
Use the HTML 2 above.
How many HTML tags does the CSS selector h2 ~ *, .bold select in the page above?
Answer
9Question 54
Use the HTML 2 above.
How many HTML tags does the CSS selector div + *, h2 select in the page above?
Answer
3