Study Material and Notes of Chapter 4 Introduction to HTML Computer Science Class 9th

• HTML stands for Hypertext Markup Language.

Overview of HTML

Who Invented HTML: HTML was invented in November 1990 by a scientist called Tim Berneses-Lee. 

A brief history: HTML is an improved version of Standard Generalised Markup Language(SGML) which is a Meta Language used for defining and creating descriptive markup language.

• Tools needed to get started with HTML documents:
→ A text editor/HTML editor
→ A Web Browser

Tags and attributes

→ A tag is a special word enclosed in angle-brackets < >. It tells the browser to perform an action as asked by the special word.

→ The characteristics or the features of a tag are defined by an attribute. An attribute is used
inside a tag which always takes a value to help the browser perform the specific task in a particular direction.

→ An element is a combination of a start tag, the text and the end tag.
For example:  <body> element begins with start tag, followed by text and ends with end tag.</body>

• Container of Tags: One set of tags may contain another set of tags. This is called nesting
of tags. For example: <TAG1> <TAG2>……………</TAG2> </TAG1>.

Here, <TAG1> and </TAG1> is the first block of tags. <TAG2> and </TAG2> is the second block of tags.

Structure of HTML document

• Basic structure of HTML document is:

Structure of HTML document

• The basic structure of the HTML document is divided into two sections namely, the head and the body.

→ The first section helps in changing the heading on the title bar of the HTML document (the webpage).

→ The second section begins with the start tag of BODY. The data on the webpage is displayed through the tags used in this section.

Saving the HTML document

• After writing HTML code, click on File menu and select Save option. A window open asking o save the file in a folder. Give a name and an extension to the file. The extension in this file will be .html or .htm. which will turn the file into a webpage.

• To modify the webpage, either open the web page and click on View →source or open the webpage with notepad.

Container and empty tags

• A container tag has both the start and the end tag. The text or the graphic is inserted inside the beginning and end tag of the container tag. For example: <body>This is a container tag</body>. The <BODY> tag here is a container tag which has both the beginning and the ending tag and the text in between both the tags.

• The empty tag is a stand-alone tag. This implies that such a tag has beginning but no ending tag. For example: The <BR> tag is used for adding one line break.

→ Other empty tags are HR tag, Comment tag.

BODY tag

• The second section of the webpage begins with the <BODY> tag. This defines the visible section of the document.

• It has a number of attributes which controls the overall appearance of the document. Below is the list of attributes of the <BODY> tag:

List of attributes of the <BODY> tag

Formatting Elements

• There are a number of tags that help you to format the text.

• <Heading tags>: It is used to display the heading or the main topic on the web page. This tag varies from H1 to H6.

→ This is a container tag.

→ The font size of headings decreases with the increase in the number of heading tag.

→ The <H1> tag shows the heading with the largest font size while <H6> tag shows the heading with the smallest font size.

• <FONT> tag: The FONT tag is a container tag that has a number of attributes given in the table.

Attributes of Font Tag

Entering Paragraph text on your Web page: A paragraph can be written on the web document using the <p> tag. This is a container tag, though the </p> tag is optional.

→ It uses one attribute called align that takes the value left, right or center.

The Center tag: It places the text in the center. Sometimes it may not be possible to use align
attribute again and again along with a tag. Then it is better to use nested form of center
tag once and use other tags inside the opening and closing center tags.

Bold, Italics and Underline: There are other tag that help in changing the style of the font.

→ <B> ,  </B> : used for making bold text.
→ <I> ,  </I> : used for making italic text.
→ <U> ,  </U>: used for making underlined text.

Summary of all the tags used with their example and the output

Summary of all the tags used
Summary of all the tags used

NCERT Solutions of Ch 4 Introduction to HTML

Previous Post Next Post