HTML HEADINGS
DEFENITION OF HTML HEADING's
HTML defines six levels of headings. A heading element implies all the font changes, paragraph breaks before and after, and any white space necessary to render the heading. The headingelements are H1, H2, H3, H4, H5, and H6 with H1 being the highest (or most important) level and H6 the least.
Headings are important in HTML documents.
HTML HEADING's
Headings are defined with the <h1> to <h6> tags.
<h1> defines the most important heading. <h6> defines the least important heading.
EXAMPLE
<!DOCTYPE html>
<html>
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
</body>
</html>
RESULTS
This is heading 1
This is heading 2
This is heading 3
This is heading 4
This is heading 5
This is heading 6
HEADINGS ARE IMPORTANT
Search engines use the headings to index the structure and content of your web pages.
Users skim your pages by its headings. It is important to use headings to show the document structure.
<h1> headings should be used for main headings, followed by <h2> headings, then the less important <h3>, and so on.
HTML HORIZONTAL RULES
The <hr> tag defines a thematic break in an HTML page, and is most often displayed as a horizontal rule.
The <hr> element is used to separate content (or define a change) in an HTML page:
EXAMPLE
<!DOCTYPE html>
<html>
<body>
<h1>This is heading 1</h1>
<p>This is some text.</p>
<hr>
<h2>This is heading 2</h2>
<p>This is some other text.</p>
<hr>
<h2>This is heading 2</h2>
<p>This is some other text.</p>
</body>
</html>
RESULTS
This is heading 1
This is some text.This is heading 2
This is some other text.This is heading 2
This is some other text.THE HTML <head> ELEMENT
The HTML <head> element has nothing to do with HTML headings.
The <head> element is a container for metadata. HTML metadata is data about the HTML document. Metadata is not displayed.
The <head> element is placed between the <html> tag and the <body> tag:
EXAMPLE
<!DOCTYPE html>
<html>
<head>
<title>My First HTML</title>
<meta charset="UTF-8">
</head>
<body>
<p>The HTML head element contains meta data.</p>
<p>Meta data is data about the HTML document.</p>
</body>
</html>
RESULTS
Meta data is data about the HTML document.
How to View HTML Source?
Have you ever seen a Web page and wondered "Hey! How did they do that?"
View HTML Source Code:
To find out, right-click in the page and select "View Page Source" (in Chrome) or "View Source" (in IE), or similar in other browsers. This will open a window containing the HTML source code of the page.
Inspect an HTML Element:
Right-click on an element (or a blank area), and choose "Inspect" or "Inspect Element" to see what elements are made up of (you will see both the HTML and the CSS). You can also edit the HTML or CSS on-the-fly in the Elements or Styles panel that opens.
HTML TAG REFERENCE
websitedesigncodelearning' tag reference contains additional information about these tags and their attributes.
You will learn more about HTML tags and attributes in the next chapters of this tutorial.
| Tag | Description |
|---|---|
| <html> | Defines the root of an HTML document |
| <body> | Defines the document's body |
| <head> | A container for all the head elements (title, scripts, styles, meta information, and more) |
| <h1> to <h6> | Defines HTML headings |
| <hr> | Defines a thematic change in the content |
Comments
Post a Comment