Creating an HTML Page - Exercise

Creating an HTML Page

Duration: 15 to 25 minutes.

In this exercise, you will create an HTML page from scratch. It should look like the page in the picture below: Exercise Solution

Create a new page and save it as index.html in the Text/Exercises directory.
Write code to make the page look like the one in the screenshot above.
Save your work and open your new page in a browser to test it.

Use special characters instead of the dashes to make more interesting bullets. Try •

Solution:

Text/Solutions/index.html

<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Runners Home&trade;</title>
</head>
<body>
<div>Home | Races | Resources | Calculator | Running Log | My Account | Log out</div>
<p>Hello, Stranger!</p>
<h1>Welcome to Runners Home&trade;</h1>
<p>
	Runners Home&trade; is dedicated to providing you with:<br>
	 - the most up-to-date information on running races.<br>
	 - the best resources for runners.
</p>
<hr>
<p>&copy; 2018 Runners Home. All rights reserved.</p>
</body>
</html>

Code Explanation

Solution:

Text/Solutions/index-challenge.html

<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Runners Home&trade;</title>
</head>
<body>
<div>Home | Races | Resources | Calculator | Running Log | My Account | Log out</div>
<p>Hello, Stranger!</p>
<h1>Welcome to Runners Home&trade;</h1>
<p>
	Runners Home&trade; is dedicated to providing you with:<br>
	&#8226; the most up-to-date information on running races.<br>
	&#8226; the best resources for runners.
</p>
<hr>
<p>&copy; 2018 Runners Home. All rights reserved.</p>
</body>
</html>

This tutorial is based on Webucator's Introduction to HTML Training Course. We also offer many other HTML Training courses. Sign up today to get help from a live instructor.