HTML Basic
Almost every HTML document shares the same few parts. Once you recognize them, any page looks familiar.
Before learning individual tags, it helps to see the pieces that appear in nearly every document. This chapter shows a few basic examples; do not worry about tags you have not met yet.
The Document Skeleton
- <!DOCTYPE html> tells the browser this is a modern HTML5 document.
- <html> wraps the entire page.
- <head> holds settings like the page title that are not shown in the body.
- <body> holds everything the visitor actually sees.
The skeleton
<!DOCTYPE html>
<html>
<head>
<title>Page title</title>
</head>
<body>
<h1>A heading</h1>
<p>A paragraph.</p>
</body>
</html>Headings
Headings are defined with <h1> through <h6>. <h1> is the most important and <h6> the least.
Headings
<!DOCTYPE html>
<html>
<body>
<h1>Main title</h1>
<h2>Section title</h2>
<h3>Smaller heading</h3>
</body>
</html>Paragraphs and Links
Text goes in <p> elements, and links are made with the <a> element and its href attribute.
Paragraph and link
<!DOCTYPE html>
<html>
<body>
<p>This is a paragraph.</p>
<a href="https://www.hyring.com">Visit Hyring</a>
</body>
</html>Note: Do not try to learn every tag now. We build up from these basics one topic at a time.
Exercise: HTML Basic
What is the purpose of the DOCTYPE declaration at the top of an HTML document?
