HTML & CSS Practice Test (with solutions) – Problems, exercises, questions
Test yourself with real HTML & CSS practice test questions and coding exercises. Detailed solutions are available for most problems. More advanced problems are available in the second half of the test.
HTML Practice Problems (no CSS)
These questions are geared toward those that have just learned HTML but not CSS yet. More advanced problems that include CSS are available in the second half of this practice test (see the table of contents).
Guides and tools you may need to solve these problems:
Which attribute tells the browser where to go when a hyperlink is clicked?
What HTML tag creates a bulleted list?
Create the following web page (using only HTML):
- All of the HTML code you'll need was taught in our HTML tutorial.
- URL for the image: https://www.delidded.com/logo.png
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Delidded Web Design</title>
</head>
<body>
<a href="https://www.delidded.com">
<img src="https://www.delidded.com/logo.png" alt="Delidded logo">
</a>
<h1>Delidded Web Design</h1>
<p>
Making <strong>great</strong> sites since:
<br>
2018
</p>
<h2>Our services</h2>
<ul>
<li>HTML</li>
<li>CSS</li>
<li>And <em>Javascript</em> programming</li>
</ul>
</body>
</html>
Create the following web page (using only HTML):
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Delidded Web Design</title>
</head>
<body>
<p>
Want a free quote?
<a href="/html-css-practice-test/" target="_blank">Contact us</a>
</p>
<h2>FREE Code Sample (written in <em>CSS</em>)</h2>
<pre>
/* This code makes all h1 tags red */
h1 {
color: red;
}
</pre>
</body>
</html>
Create the following table (using only HTML)
- Need help? See our guide on HTML Tables.
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>March Bills</title>
</head>
<body>
<h2>March Bills</h2>
<table>
<tr>
<th></th>
<th>Price</th>
<th>Due Date</td>
</tr>
<tr>
<td>Phone</td>
<td>$50</td>
<td>March 1st</td>
</tr>
<tr>
<td>Car insurance</td>
<td>$100</td>
<td>March 5th</td>
</tr>
<tr>
<td>Internet</td>
<td>$70</td>
<td>March 10th</td>
</tr>
</table>
</body>
</html>