Download as docx, pdf, or txt
Download as docx, pdf, or txt
You are on page 1of 3

Definition and Usage of “h”

The <h1> to <h6> tags are used to define HTML headings.

<h1> defines the most important heading. <h6> defines the least important
heading.

Note: Only use one <h1> per page - this should represent the main
heading/subject for the whole page. Also, do not skip heading levels - start with
<h1>, then use <h2>, and so on.

Review:

<!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>

The HTML <title> Element


The <title> element defines the title of the document. The title must be text-
only, and it is shown in the browser's title bar or in the page's tab.

The <title> element is required in HTML documents!

The contents of a page title is very important for search engine optimization
(SEO)! The page title is used by search engine algorithms to decide the order
when listing pages in search results.

The <title> element:

● defines a title in the browser toolbar


● provides a title for the page when it is added to favorites
● displays a title for the page in search engine-results

So, try to make the title as accurate and meaningful as possible!

The HTML <style> Element


The <style> element is used to define style information for a single HTML
page:

Review 1:

<h1 style="background-color:DodgerBlue;">Hello World</h1>


<h2 style="color:Tomato;">Hello World</h2>

Review2:

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<style>
body {background-color: powderblue;}
h1 {color: red;}
p {color: blue;}
h2 {color: green;}
</style>
</head>
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<h2> here we go </h2>
</body>
</html>

------------

<!DOCTYPE html>
<html>
<head>

<title> 5F is da best </title>

</head>

<body style="background-color:Black;">
<h1 style="color:Purple;">Hello World</h1>
<h2 style="color:Tomato;">I love Sweets</h2>
<h1 style="color:Red;"> Change this text </h1>
<h2 style="background-color: White;"> To whatever you want</h2>
<h3 style="color:purple;">and lets see</h3>
<h4>Who will be the most interesting</h4>
<h5>Be creative</h5>
<h6>Good luck</h6>

</body>

You might also like