HTML Tags and Elements: 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 are the HTML Tags which are used to separate the contents of the webpage?

  2. Mention some of the basic HTML Tags.

  3. Explain DOCTYPE tag in detail.

  4. Explain Span Tag in HTML with an example.

  5. What is the use of iframe tag in HTML?

  6. Which tag is used to create Scrollable text or image in HTML?

  7. Mention the HTML tags which do not require an End Tag.

  8. What are the basic HTML Elements?

  9. Explain Nested HTML elements with example.

  10. Define Empty Elements in HTML. Give examples.

  11. What is href element of HTML?

  12. Explain Text Formatting in HTML.

  13. What are the elements used to format text in HTML? Explain them in detail.

  14. Explain the Quotation Elements in HTML.


HTML Tags and Elements


Question- 1) What are the HTML Tags which are used to separate the contents of the webpage?

Answer:

<html>
<hr>
"Hello"

<hr>Tag:

The <hr> tag defines a thematic break in an HTML page (e.g. a shift of topic).

The <hr> element is most often displayed as a horizontal rule that is used to separate content (or define a change) in an HTML page.

</html>

hr tag in html

<section> Tag:

Section tag defines the section of documents such as chapters, headers, footers or any other sections. The section tag divides the content into section and subsections.

 

Question- 2) Mention some of the basic HTML Tags.

Answer: Basic html Tags are as follows:

  1. <html> … </html> — The root element. All web pages start with the html element. It’s also called the root element because it’s at the root of the tree of elements that make up a web page.

  2. <head> … </head> — The document head. The head element contains information about the web page, as opposed to the web page content itself.

  3. <title> … </title> — The page title. The title element contains the title of the page. The title is displayed in the browser’s title bar (the bar at the top of the browser window), as well as in bookmarks, search engine results, and many other places.

  4. <body> … </body> — The page’s content. The body element appears after the head element in the page. It should contain all the content of your web page: text, images, and so on. All web pages have 1 single body element, with the exception of frameset pages, which contain frame elements instead.

  5. <h1> … </h1> — A section heading. Headings let you break up your page content into readable chunks. They work much like headings and subheadings in a book or a report.

  6. <p> … </p> — A paragraph. The p element lets you create paragraphs of text. Most browsers display paragraphs with a vertical gap between each paragraph, nicely breaking up the text.

  7. <a> … </a> — A link. One of the most important elements in a web page, the a element lets you create links to other content. The content can be either on your own site or on another site.

  8. <img> — An image. The img element lets you insert images into your web pages. To insert an image, you first upload the image to your web server, then use an <img> tag to reference the uploaded image filename.

  9. <div> … </div> — A block-level container for content. The div element is a generic container that you can use to add more structure to your page content. For example, you might group several paragraphs or headings that serve a similar purpose together inside a div element.

  10. <span> … </span> — An inline container for content. The span element is similar to div in that it’s used to add structure to your content.


 

Question- 3) Explain DOCTYPE tag in detail.

Answer: HTML <!DOCTYPE> tag is used to inform the browser about the version of HTML used in the document. It is called as the document type declaration (DTD).

Technically <!DOCTYPE > is not a tag/element, it just an instruction to the browser about the document type. It is a null element which does not contain the closing tag, and must not include any content within it.

The doctype declaration differs between HTML versions. The HTML 5 doctype declaration is given below.

Syntax:

<!DOCTYPE html>


 

Question- 4) Explain Span Tag in HTML with an example.

Answer: The <span> tag is an inline container used to mark up a part of a text, or a part of a document. The <span> tag is easily styled by CSS or manipulated with JavaScript using the class or id attribute.

The <span> tag is much like the <div> element, but <div> is a block-level element and <span> is an inline element.

Example :

<p>My mother has <span style="color:blue">blue</span> eyes.</p>

My mother has blue eyes.


 

Question- 5) What is the use of iFrame tag in HTML?

Answer:

  • An iFrame is a frame within a frame.

  • It is a component of an HTML element that allows you to embed documents, videos, and interactive media within a page.

  • Thus, one can display a secondary webpage on your main page.

  • The iFrame element allows you to include a piece of content from other sources.


 

Question- 6) Which tag is used to create Scrollable text or image in HTML?

Answer: <marquee> tag is used to create a scrollable text in html.


 

Question- 7) Mention the HTML tags which do not require an End Tag.

Answer:

  • <area>: Used for the area inside of an image map.

  • <base>: The base URL for all relative URLs in a document. There can be no more than one of these per document and it must be in the head of the page.

  • <br>: A line break, often used in text content to create a single line break instead of a paragraph. It should not be used to create visual separation on a page by stacking up many <br> tags, because that function is a visual need and therefore the domain of CSS instead of HTML.

  • <col>: Specifies column properties for each column within a <colgroup> element.

  • <command>: Specifies a command that a visitor can invoke.

  • <embed>: Used with external applications and interactive content for integration.

  • <hr>: A horizontal rule, which is a straight line on a page. In many cases, CSS borders create separator lines instead of this HTML element.

  • <img>: One of the workhorse elements of HTML, this is the image tag. It is used to add graphic images to a webpage.

  • <input>: A form element that is used to capture information from visitors. There are a number of valid input types, from the common "text" input that has been used in forms for years, to some new input types that are part of HTML5.

  • <keygen>: This tag creates a key-pair generator field that is used for forms.

  • <link>: Not to be confused with the "hyperlink" or anchor (<a>) tag, this link is to set linkage between a document and an external resource. Use it to link to an external CSS file, for example.

  • <meta>: Meta tags are "information about content." They are found in the head of a document and used to convey page information to the browser. There are many different meta tags that you can use on a webpage.

  • <param>: Used to define parameters for plugins.

  • <source>: This tag allows you to specify alternative file paths for media on your page, including videos or images or audio files.

  • <track>: This tag sets a track to be used with a media file, a video, or audio, which are often added with the <video> or <audio> tags.

  • <wbr>: This stands for Word Break Opportunity. It specifies where in a block of text it would be acceptable to add a line break.


 

Question- 8) What are the basic HTML Elements?

Answer: The basic elements of an HTML page are:

Element

Denoted by

A text header

<h1>, <h2>, <h3>, <h4>, <h5>, <h6> tags.

A paragraph

<p> tag.

​A horizontal ruler

<hr> tag.

​A link

​<a> (anchor) tag.

​A list

<ul> (unordered list), <ol> (ordered list) and <li> (list element) tags.

​An image

<img> tag

​A divider

<div> tag

​A text span

​<span> tag


 

Question- 9) Explain Nested HTML elements with example.

Answer: HTML elements can be nested (this means that elements can contain other elements).

The following example contains four HTML elements (<html>, <body>, <h1> and <p>):

Example :


<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>


The <html> element is the root element and it defines the whole HTML document.It has a start tag <html> and an end tag </html>.Then, inside the <html> element there is a <body> element:

The <body> element defines the document's body. It has a start tag <body> and an end tag </body>.Then, inside the <body> element there are two other elements:

<h1> and <p>:

The <h1> element defines a heading.It has a start tag <h1> and an end tag </h1>

The <p> element defines a paragraph.It has a start tag <p> and an end tag </p>


 

Question- 10) Define Empty Elements in HTML. Give examples.

Answer: An empty element is an element from HTML, SVG, or MathML that cannot have any child nodes (i.e., nested elements or text nodes).

The HTML, SVG, and MathML specifications define very precisely what each element can contain. Many combinations have no semantic meaning, for example an <audio> element nested inside an <hr> element.

In HTML, using a closing tag on an empty element is usually invalid. For example, <input type="text"></input> is invalid HTML.

The empty elements in HTML are as follows:


<area>
<base>
<br>
<col>
<embed>
<hr>
<img>
<input>
<keygen>(HTML 5.2 Draft removed)
<link>
<meta>
<param>
<source>
<track>
<wbr>


 

Question- 11) What is href element of HTML?

Answer: href is an attribute defined by <a> tag(hyperlink) which specifies the URL of the page link .

Example

<a href="https://www.xyz.com">XYZ</a>


 

Question- 12) Explain Text Formatting in HTML.

Answer: HTML Formatting is a process of formatting text for better look and feel. HTML provides us the ability to format text without using CSS. There are many formatting tags in HTML. These tags are used to make text bold, italicized, or underlined.


 

Question- 13) What are the elements used to format text in HTML? Explain them in detail.

Answer:

  • <b> -

The HTML <b> element defines bold text, without any extra importance.

Example:

<b>This text is bold</b>

  • <strong> -

The HTML <strong> element defines text with strong importance. The content inside is typically displayed in bold.

Example:

<strong>This text is important!</strong>

  • <i> -

The HTML <i> element defines a part of text in an alternate voice or mood. The content inside is typically displayed in italic.The <i> tag is often used to indicate a technical term, a phrase from another language, a thought, a ship name, etc.

Example

<i>This text is italic</i>

  • <em> -

The HTML <em> element defines emphasized text. The content inside is typically displayed in italic.A screen reader will pronounce the words in <em> with an emphasis, using verbal stress.

Example

<em>This text is emphasized</em>

  • <mark> -

The HTML <mark> element defines text that should be marked or highlighted:

Example

<p>Do not forget to buy <mark>milk</mark> today.</p>

  • <small> -

The HTML <small> element defines smaller text:

Example

<small>This is some smaller text.</small>

  • <del> -

The HTML <del> element defines text that has been deleted from a document. Browsers will usually strike a line through deleted text:

Example

<p>My favorite color is <del>blue</del> red.</p>

  • <ins> -

The HTML <ins> element defines a text that has been inserted into a document. Browsers will usually underline inserted text:

Example

<p>My favorite color is <del>blue</del> <ins>red</ins>.</p>

  • <sub> -

The HTML <sub> element defines subscript text. Subscript text appears half a character below the normal line, and is sometimes rendered in a smaller font. Subscript text can be used for chemical formulas, like H2O:

Example

<p>This is <sub>subscripted</sub> text.</p>

  • <sup> -

The HTML <sup> element defines superscript text. Superscript text appears half a character above the normal line, and is sometimes rendered in a smaller font. Superscript text can be used for footnotes, like WWW[1]:

Example

<p>This is <sup>superscripted</sup> text.</p>


 

Question- 14) Explain the Quotation Elements in HTML.

Answer: There are three major HTML elements involved in quotations:

1.<blockquote>:

The HTML <blockquote> element is used to define a section which is quoted from some other source.

Browsers normally indent <blockquote> elements.

Example

<p>Here is a quote from WWF's website:</p>

<blockquote cite="http://www.worldwildlife.org/who/index.html">

For 50 years, WWF has been protecting the future of nature.

The world's leading conservation organization,

WWF works in 100 countries and is supported by

1.2 million members in the United States and

close to 5 million globally.

</blockquote>


2.<q>:

The HTML <q> element is used to define a short quotation.

Browsers normally tend to insert quotation marks around the element.

Example

<p>WWF's goal is to: <q>Build a future where people live in harmony with nature.</q></p>


3. <cite>.

The HTML <cite> element is used to define the title of a work.

Browsers normally will display <cite> elements in italic.

Example

<p><cite>The Scream</cite> by Edvard Munch. Painted in 1893.</p>


 





 


9 views0 comments

Recent Posts

See All