HTML Tutorial #3: Basic, Headings and Lists

3

As we know, to add paragraph to our page we use <p> </p> tag. Now we are moving towards “headings” in HTML.

Headings

There are 6 headings in HTML. Headings can be defined with <h1> to <h6>. <h1> is the leading heading from these 6 headings <h1>, <h2>, <h3>, <h4>, <h5> and <h6>. <h1> has a font size of 24pt, then it gradually comes down to <h6> at font size of 8pt, <h6> is the smallest heading in HTML. Now let’s test it. Create a HTML document and type the following code and you will see result, h1 will show the biggest heading and h6 will show the smallest heading.

headingpreview

Use only h1 to write the heading to the article and if you want to add some sub-heading then use h2. It will be helpful for indexing your webpage in browser. boldtextDon’t use headings to make text bold. If you want to make text bold the <b> tag. For a line brake we can use <br> tag. Some other tags for text effect. <strong></strong> and <small></small>.

boldnlinebrake

HTML Comments

Every professional HTML expert will use HTML comments in his coding. HTML comments are very useful and helpful for us, while coding if we use comments then later when we read our html document then comments will help us to understand what we have coded there and it also helps if someone else has to see your code. You can add comment anywhere in html document but it will be helpful if you use it before html element. These comments are not visible on the webpage because these are ignored by web browser. You can add comment like this.

<!– your comment here –>

htmlcomment

 Lists

Mostly there are two type of lists used in html, ordered list and unordered list. Ordered list are used to show list by number or by alphabets and an unordered list is used to use a bullet list.

 Ordered Lists

Ordered list starts with <ol> tag and each item in the list is enter in a new tag <li>. <ol> means ordered list and <li> means list item. orderedlist

<ol> <li> First item </li> <li> Second item </li> <ol/>

 Unordered Lists

Unordered list starts with <ul> tag and each item is entered using <li> tag. Mostly unordered lists are unorderedlist used in HTML. Unordered list is also called bullet list, it is represented by black circles.

<ul> <li> First item </li> <li> Second item </li> <ul/>

HTML Lines

There is a element used to show a horizontal line in HTML webpage. To show a horizontal line on webpage, we use <hr /> element, <hr/> it a unpaired tag and we can use it anywhere in HTML document just add <hr />  element where you want to show horizontal lines.



Journalist, Android Application Developer and Web Designer. Writes article about IT in Roznama Dunya. I Interview Prominent Personalities & Icons around the globe.


Leave a Reply

Translate »