Friday, December 21, 2018
HOW TO CREATE HEADINGS, HORIZONTAL LINE AND COMMENT ON A WEB PAGE
Hi, In today’s lesson, I will be teaching you how to create headings, horizontal line and comments on a web page using HTML. In our next lesson, I will teach you how to create ‘About Me’ page on a website. We’re gradually coming to the end of HTML lesson and in no time we will move to CSS.
Nevertheless, let’s dive into today’s lesson.
CREATING HEADINGS, HORIZONTAL LINE, AND COMMENTS ON A WEB PAGE
1. HEADING
Creating a heading in HTML document is not that hard. But before I proceed, I want you to note that there are six levels of headings in HTML. These headings are ranked according to its importance. The various headings include <h1>,<h2>,<h3>,<h4>,<h5>, and <h6>.
To make these clearer, the codes below defines all the headings in HTML. Open your text editor, and input the codes below:
<html>
<head>
<title>Homepage</title>
</head>
<body>
<h1> This is our first heading</h1>
<h2> This is our second heading</h2>
<h3> This is our third heading</h3>
<h4> This is our fourth heading</h4>
<h5> This is our fifth heading</h5>
<h6> This is our six heading</h6>
</body>
</html>
Save it and open it with your web browser to see the result.
PLEASE NOTE that Headings are very important because search engines such as Google, Bing, and Yahoo use it to index the web index the content of a web page and as well as its structure.
2. HORIZONTAL LINE
Another important thing you know is how to create horizontal line on a web page using HTML. I think creating a horizontal line is the simplest thing you can use HTML to do. To create horizontal line, all you need to do is to add the <hr> tag in the place you want the horizontal line to appear. That’s all. No long process of opening and closing tags.
Let’s consider this example:
<html>
<head>
<title>Homepage</title>
</head>
<body>
<h1> This is our first heading</h1>
<h2> This is our second heading</h2>
<h3> This is our third heading</h3>
<h4> This is our fourth heading</h4>
<h5> This is our fifth heading</h5>
<hr>
<h6> This is our six heading</h6>
</body>
</html>
* Save and open it to view the result.
3. COMMENT
This is where descriptions, reminders and other important notes can be added. If you want to create a comment using HTML, just add the following:
<!—then your comment--> at the bottom or anywhere on the web page.
PLEASE NOTE: That comment will not display on your web browser if you just want to test it now.
Let us look at an example: lets say I want to add ‘I am a coding lioness’ as a comment, I will add the code below.
<html>
<head>
<title>Homepage</title>
</head>
<body>
<h1> This is our first heading</h1>
<h2> This is our second heading</h2>
<hr>
<h6> This is our six heading</h6>
<!—I am a coding lioness-->
</body>
</html>
*Save and open it to see the result
WRAPPING UP
Constant practice will help you become a pro in anything. So if you want to become an expert on HTML, please do well to practice the lessons. Creating ‘About Me’ section on a website will be our next lesson.
Subscribe to:
Post Comments
(
Atom
)
No comments :
Post a Comment