HTML 5 Programming and Web development/HTML 5 Elements
HTML Tags[edit | edit source]
In HTML, tags are used to create elements of a web page. Examples of elements are paragraphs and headings. Tags are surrounded by angle brackets, like this: <tag> An example of an HTML 5 tag is h1.This tag creates a heading element and it is written like this.
<h1>Hello world!</h1>
h1 is the highest-level heading in HTML. Think of it like a headline for a news story. There are two types of tags. The first, like you've seen here, starts with <h1> and ends with </h1>. These markers show where the heading begins and ends. In the same way, a paragraph is marked at the beginning with <p> and at the end with </p>. The second type of tag is self-closing; that is, it does not have a second tag marking its end.
Some examples of self-closing tags are <br/> (line break), <hr/> (horizontal rule), <input/> (element that accepts user input), and <meta/> (an element that contains information about the web page itself).
While the ending slash (/) on a self-closing tag is optional, it is considered a best practice to include them.
HTML Elements[edit | edit source]
An HTML element is an object in a web page. Some examples are images, paragraphs, headings, and videos. They start with a start tag and end with an end tag. HTML 5 has different kinds of elements that we will learn about throughout this course.
How to write an HTML Element[edit | edit source]
To write an HTML Element we first write the start tags<title>. Then we write the content of the element: My first HTML Page.Then we write the end tag. </title>. When you put it together you have an HTML element.
<title>My first HTML 5 page</title>
Nested Elements[edit | edit source]
The content of an HTML element can be another element. This is called "nesting". For example:
<head>
<title>My first HTML tag</title>
</head>
Note: New line characters are ignored in HTML 5.
<b>
This is
Multiline
Text.
</b>
This code would actually render like this:
This is Multiline Text.
To achieve multi-line we actually use the line break tag <br/>.
List of HTML 5 Elements[edit | edit source]
Note this is just a short list of elements:
<p><input><table><body><header><nav><article>
Example of a well formed HTML document[edit | edit source]
about:blank
<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<title>Title</title>
</head>
<body>
<p>This is a normal Text</p>
<p><b>This Is Bold text</b></p>
</body>
</html>
The <!doctype html> is not an HTML tag, so it has no closing tag or terminating slash. It is a Document Type Definition which we will learn about subsequently.