Headings and Lists: HTML Class Notes

Updated: Aug 17

Mobiprep has created last-minute notes for all topics of HTML to help you with the revision of concepts for your university examinations. So let’s get started with the lecture notes on HTML.

  1. HTML Introduction

  2. HTML Tags and Elements

  3. Attributes and Hyperlinks

  4. Headings and Lists

  5. Class and id attributes

  6. Semantic Elements

  7. Inline and Block-Level Elements

  8. Div and Span

  9. Img

  10. Tables

  11. Forms

Our team has curated a list of the most important questions asked in universities such as DU, DTU, VIT, SRM, IP, Pune University, Manipal University, and many more. The questions are created from the previous year's question papers of colleges and universities.

  1. What is a Heading in HTML?

  2. Why are headings important in a webpage?

  3. How do the different types of Headings look in HTML?

  4. What is a List In HTML?

  5. What are the different types of Lists used in HTML? Differentiate them.

  6. What are list item markers?

  7. What is inserted to remove default settings of list item markers?


Headings and Lists


Question- 1) What is a Heading in HTML?

Answer: A HTML heading or HTML h tag is a title or a subtitle which gets displayed on the webpage. When the text is placed within the heading tags <h1>.........</h1>, it gets displayed on the browser in the bold and size of the text depends on the number of heading.

There are six different HTML headings which are defined with the <h1> to <h6> tags, from highest level h1 (main heading) to the least level h6 (least important heading).

h1 is the heading tag with largest font and h6 is the tag with smallest font size . So for most important heading h1 is used and for least important h6 is used .

Heading elements are used for headings only. It can't be used just to make text bold or big.

HTML headings are also used with nested elements.


 

Question- 2) Why are headings important in a webpage?

Answer:

  • By highlighting important topics and the structure of the document HTML headings provide valuable information, so to improve user engagement they should be optimized carefully.

  • The headings are used by search engines to index the structure and content of web pages.

  • Users often skim a page by its headings. To show the document structure it is important to use headings.

  • However, headings help readers in identifying the main points of each section in the paper.


 

Question- 3) How do the different types of Headings look in HTML?

Answer: There six levels of heading tags in HTML , <h1> through <h6>; the higher the heading level number, the greater its importance — therefore <h1> tag is used for the most important heading, whereas the <h6> tag is used for the least important heading in the document.

By default, headings get displayed in larger and bolder font than normal text by browser.<h1> headings displays text in largest font size whereas <h6> headings displays text in smallest font size.

Example :

<h1>level 1</h1>
<h2>level 2</h2>
<h3> level 3</h3>
<h4>level 4</h4>
<h5>level 5</h5>
<h6>level 6</h6>

Output:

level 1

level 2

level 3

level 4

level 5

level 6


 

Question- 4) What is a List In HTML?

Answer:

  • To group together related pieces of information lists are used. Lists in HTML are associated with each other and easy to read.

  • Lists in HTML help in creating a well-structured, more accessible, easy-to-maintain document.

  • They are also useful because they provide specialized elements to which users can attach CSS styles.

  • Finally, semantically correct lists help visitors read websites, and they simplify maintenance when pages need to be updated.


 

Question- 5) What are the different types of Lists used in HTML? Differentiate them.

Answer: There are three list types in HTML:

  1. Ordered lists

  2. Unordered lists

  3. Description list

​Ordered lists

Unordered lists

Description list

  • ​A set of related items are grouped in a specific order by using ordered lists.

  • ​A set of related items are grouped using Unordered lists in no particular order.

  • It is used to display name/value pairs such as terms and definitions.

  • An example would be cooking instructions.

  • An example is a shopping list.

  • An example would be the Nested index in a book.

  • ​If the list items were moved around into a different order, the information would no longer make sense.

  • ​Although the items are all part of one list, you could put the items in any order and the list would still make sense.

  • Description lists are flexible: you can associate more than one value with a single name, or vice versa.

  • It is also known as number list.

  • It is also known as bulleted list.

  • ​It is a list of items with a description or definition of each item.

  • Tag is <OL>.

  • Tag is <UL>.

  • Created using the <dl> element.


 

Question- 6) What are list item markers?

Answer:

  • list-style-type specify which marker is the list using. For example, it can have the following values: circle, square, upper-roman, lower-alpha.

  • list-style-image: the only difference is in its input as image url.

  • list-style-position: It specifies position as outside or inside.



 

Question- 7) What is inserted to remove default settings of list item markers?

Answer: list- style- type: none


 





2 views0 comments

Recent Posts

See All