Notes HTML Internet
Notes HTML Internet
UNIT STRUCTURE
1.0 Objective
1.1 Concept of Internet
1.2 Evolution of internet
1.3 Basic concepts
1.4 Communication on the Internet
1.5 Internet Domains
1.6 Internet Server Identities
1.7 Establishing Connectivity on Internet
1.8 Client IP Address
1.9 TCP/IP and its Services
1.10 Web Server
1.11 Web Client
1.12 Domain Registration
1.13 Summary
1.14 Question for Exercise
1.15 Suggested Readings
1.0 Objective
Defense Advanced Research Project Agency (DARPA) of US initiated a research activity that
eventually developed as a system for global data communication service known as the Internet.
The internet, today, is being operated as a joint effort of many different organizations. In this
unit, you will learn the basic concepts related to internet as well as the various mechanisms and
technologies involved in the deployment of the internet. Upon completion of this unit, the
readers shall be aware of the basic terms and terminologies, involved devices and mechanisms
and the applications of the Internet.
Though the terms Internet and World Wide Web are used interchangeably in lay man terms they
are not the same. It is common practice to say "going on the Internet" whenever we open any
web page on a browser. However, the World Wide Web or the Web is one of the most popular
Internet services available. The Web is a collection of interconnected documents (web pages)
and other web resources, linked by hyperlinks and URLs. It uses HTTP as an underlying
protocol for information transfer which is one of the several other protocols available in
networking theory.
The Internet is a global collection of computer networks that are linked together by devices
called routers and use a common set of protocols for data transmission known as TCP/IP
(transmission control protocol / Internet protocol). The primary purpose of the Internet is to
facilitate the sharing of information. There are many different tools used on the Internet to make
this possible. Some of the more common tools include email, list servers, newsgroups, telnet,
gopher, FTP, and the World Wide Web. Probably the most popular of all Internet tools is the
World Wide Web.
1.3.3.1 HTTP
HTTP is the short form for Hypertext Transfer Protocol. An example of the standard URL is
http://www.google.com. The prefix http in the URL designates the protocol being used for
communication. The HTTP protocol is used to access hypertext documents on the World Wide
Web.
1.3.3.2 URL
URL refers to Uniform Resource Locator. URLs are used as the address of the documents
available on the World Wide Web. A URL is the fundamental identifier of any resource available
on the web e. g., hypertext pages, images, and sound files. The standard format of a URL has
been specified as –
protocol://hostname/other_information
A protocol is, basically, a specification of the flow of information in a network. The protocol
required for accessing the resources available on the web is called Hyper Text Transfer Protocol
(HTTP). Other protocols supported by the web browsers include telnet, FTP, Gopher, etc. The
name of the protocol is followed by a colon, two forward slashes, and then the hostname. The
hostname refers to the computer having the requested resource. Hostname is followed by a single
forward slash and links to subdirectories or any particular file. The path to the directory holding
the requested file or resource may contain single forward slashes.
1.3.3.3 Website
Website refers to a collection of web pages usually written in markup language. For example:
www.google.com refers to the website of Google having ‘com’ as the domain name. Websites
can be understood as a location on the World Wide Web that holds the resources which people
can request when required. The first or the initial page of any website is known as the home page
of that particular website.
Websites are usually hosted on a computer which is known as a Web server. These servers
should require constant connectivity with the internet so that the resources stored by them can be
accessed from anywhere in the world. A web server is provided with a unique address which is
required to access the contents of the server. The unique address is the identifier for the server
and is termed as IP Address. These IP Addresses comprise of a series of four numbers separated
by dots or periods. Each number lies between the range of 0 – 255, for example: 192.168.1.1. IP
address of the web server is also required when the URL of the website hosted on that server is
registered on the World Wide Web.
Web Browser is a software required to access the resources available on the World Wide Web.
Hence, in order to access any website web browser is required. Examples of web browsers are:
Microsoft Internet Explorer, Google Chrome, Mozilla Firefox, Netscape Navigator, etc.
Navigating through the pages of a website is termed as web browsing or surfing.
1.3.3.6 ISP
ISP is the short form for Internet Service Provider. They are basically the organizations
responsible for providing internet connections to the subscribers. Several ISPs also provide space
on their web servers for hosting website of the subscribers.
1.3.3.7 HTML
HTML refers to Hyper Text Markup Language. It is the development language of the websites
available on the web. HTML can be understood as a subset of SGML (Standard Generalized
Mark-Up Language).
1.3.3.8 Hyperlink
Hyperlinks can be understood as the access points to other resources of the same or different
websites. A hyperlink, sometimes referred to as a link, is a clickable element in an electronic
document used to navigate through the linked resources. Typically, you click the hyperlink to
access the linked resource. Hyperlinks can be in the form of clickable textual links, icons,
buttons, etc.
1.3.3.9 DNS
DNS is the short form for Domain Name System. It is used to provide a mapping between the
name of the requested website and its IP address. Usually, user remembers the name or URL of a
website. When user enters this URL in the web browser, a request is sent to DNS for resolving
the entered URL in terms of its IP address. It is the IP address which will be used to locate the
requested resource on the web. The mapping of the URL and the IP address a website is usually
built during the registration of the domain name.
1.3.3.10 W3C
1.3.4 IP Addressing
IP addresses refer to the unique identifier associated with each computer on the internet. These
addresses are also called logical address and are used to uniquely identify the communicating
entities on the internet. IP addresses are provided and managed by the Internet Protocol at the
network layer of the OSI model. IP addresses can be of two types: IPv4 and IPv6.
IPv4 uses a 32-bit address having the address space equal to 232. An address space refers to the
total number of addresses that can be used by the protocol. Figure 1.2 shows the format of an
IPv4 address. Two types of notations have been used to represent an IPv4 addresses:
Binary notation: In this notation, the IPv4 address is represented as sequence of 32 bits divided
into 4 octets. Each octet refers to eight bits or 1 byte. Thus, IPv4 addresses are sometimes
referred to as 4-byte address. Eg: 01110101 10001010 000011101 00000010
Dotted-Decimal notation: In order to facilitate easy reading of the IP addresses, they are
sometimes written as a sequence of decimal numbers with each byte separated by a period or dot
(.). Eg: 192.168.1.10.
These IPv4 addresses employ the concept of classes. The strategy to classify the address space
into classes is known as classful addressing. This mechanism splits the address space into 5
classes: A, B, C, D, and E. Examining the first few bits of the binary notation or the first byte of
the dotted-decimal notation of the IPv4 address can help in identifying the class to which the
address belongs. Table 1.1 shows the different classes of IP.
In classful addressing, an IPv4 address is composed of two parts: network id and host id. The
length of these parts vary with respect to the corresponding class. This concept is applicable only
for the addresses of class A, B, and C. For the addresses belonging to class A, the first byte
corresponds to network id while the remaining 3 bytes refer to host id. Similarly, for class B, the
first two bytes refer to network id while the remaining two bytes refer to host id. Finally, for
class C, the first three bytes refer to network id while the remaining one byte indicates host id.
It is the responsibility of the Internet Service Provider (ISP) to assign the IP addresses to the
computers communicating on the internet so as to identify the country or region from which a
computer is connecting to the WEB. The assignment of an IP address may be wither dynamic or
static.
Static assignment of IP addresses corresponds to the manual configuration of IP address on the
computers. However, a dynamic assignment employs a DHCP server that has been configured to
automatically provide IP addresses to the connected hosts.
Class Range Binary Notation Dotted Decimal Notation
From To (Range of First Byte)
Class A 1.0.0.0 127.255.255.255 0xxxxxxx xxxxxxxx 0-127
xxxxxxxx xxxxxxxx
Class B 128.0.0.0 191.255.255.255 10xxxxxx xxxxxxxx 128-191
xxxxxxxx xxxxxxxx
Class C 192.0.0.0 192.255.255.255 110xxxxx xxxxxxxx 192-223
xxxxxxxx xxxxxxxx
Class D 224.0.0.0 224.255.255.255 1110xxxx xxxxxxxx 224-239
xxxxxxxx xxxxxxxx
Class E 240.0.0.0 240.255.255.255 1111xxxx xxxxxxxx 240-255
xxxxxxxx xxxxxxxx
Table 1.1: IP address classes
A Router has more than one IP address because router connects two or more different networks.
But A computer or host can only have one and a unique ip address. A routers function is to
inspect incoming packet and determine whether it belongs to local network or to a Remote
Network, if a local packet is determined then there is no need of routing and if a Remote packet
is determined then it will route that packet according to the routing table otherwise the packet
will be discarded. Figure 1.1 shows the format of an IPv4 Address.
The Internet is a worldwide network of networks. As the Internet grew over the years it became
increasingly important to have a governing body, which allocated unique IP addresses to
organizations linked to the Internet. An international body called InterNIC, located in the USA,
is responsible for registering and assigning unique IP addresses to organizations wishing to
manage networks, which will be part of the Internet. A unique IP address therefore points to an
actual computer connected via a gateway to the Internet. This computer is known as a Domain
i.e. a place where information is available. This is a Physical Domain on the Internet.
Conceptually, a Server, which has a permanent IP address (i.e. a Physical Domain), can provide
the following:
A gateway to other computers to access the Internet
Information for Internet clients to read
A physical location on which several Virtual Domains can be hosted
In many cases, when a Web Site provides Internet clients information to read, the site is mounted
as a Virtual Domain on an Internet Server, which is its (host) Physical Domain.
Virtual Domains are identified by a name (e.g. www.microsoft.com). Just like a Physical
Domain needs to have a unique IP address, Virtual Domain Names also need to be unique on the
Internet. All Virtual Domain Names must be registered with InterNIC. One Internet Server may
host several virtual domains. Virtual domains can be conceptualized as sub directories on an
Internet server’s hard disk drive. The information that Internet clients wish to read would be
Files within the sub directory.
When an Internet client connects to an Internet server some software running on the Internet
server must respond to the Internet client’s request for information. The software that runs on an
Internet server and responds to an Internet client’s request for information is called Web Server
software.
An Internet Web server responds to an Internet client’s request for information by going to a
specific sub directory on its hard disk and forwarding a pre-determined file to the Internet client
for the first time. Further, the Web server forwards files to the client depending upon their
corresponding requests. Traditionally, this sub directory on the Internet server is ‘wwwroot’ and
the file automatically picked up and passed to the Internet client for the first time is traditionally
called ‘index.html’.
1.4.1.1 Email
Electronic mail (E-mail) is one of the most famous internet services. In earlier days of the
internet, electronic mail sent short and consist only text messages. People could exchange
messages in a fast way. Now-a-days in e-mail, messages can consist text, audio, images and
video. It provides facility to send one message to one or more recipients. Users can compose,
read and send messages through E-mail.
1.4.1.2 Instant Messaging
To send real time messages from one user to another, Instant Messaging or IM is used. One user
types a message that is conveyed over a network and received by the other user. A specific
program (i.e. Yahoo Messenger or Windows Live Messenger etc.) is used for Instant messaging
between two or more people
1.4.1.4 Social Networking
Social networking is an important way of communication. Users can connect and communicate
to each other using it. Users can make new friends, find users of similar interest and reconnect
with old friends on Social networking websites or applications. Firstly, users need to create a
profile on these websites and customize the privacy policy according to their needs (i.e. who can
see his/her photos, send friend request or post on his/her timeline etc.). Facebook, Myspace,
Twitter, Instagram etc. are the popular social networking applications.
1.4.1.5 Forums
An online discussion site where people can do conversations in the form of posted messages is
known as an Internet Forum or Message Board. In Forums, they have a specific set of jargons
associated with them. For example: a single conversation is known as a “thread” or topic. A
discussion forum has a hierarchical or tree-like structure. In a forum, there can be a number of
sub forms, each of them may contain various topics. Any new discussion within a forum’s topic
is known as thread and as many people as want can reply. It depends on the Forum’s setting that
users can be anonymous or need to register with the forum and to post messages, they need to
log in. Most of the Forums allows users to read existing messages without log in.
1.4.1.6 Audio Conferencing
Audio conferencing is used to connect multiple called parties which are located at different
locations on a single audio conference call. Two or more people can be involved in an audio
conference call at the same time. Audio conference call can be conducted either through the
internet or telephone line. Devices (i.e. phones or computers) which allows sounds to be sent and
received are used for audio conferencing. Audio conferencing needs speakers and microphones
both. For listening purpose, only speakers are needed. But for speaking purpose microphones are
also required.
1.4.1.7 Video Conferencing
People are allowed to communicate with one another in real time interactive audio/video.
Videoconferencing is an example of real time interactive audio/video in which people are
allowed to communicate visually and orally.
In videoconferencing, system is full-motion, two-way, video/audio system which allows two or
more humans to communicate with each other which is located at different places.
Videoconferencing is usually used in business meetings, distance learning and web-based
courses. To make video conferencing success, participants should be able to see, hear and use
meeting tools anyway either they are in the same room or across the other side of the world. Live
broadcast of lectures and seminars are provided by colleges and universities to some of their
students who are not able to travel to class sites. In business meetings, videoconferencing is
useful for employee training, group work or to introduce a new product or service.
1.6.3 ISDN
A standard telephone line which works over ISDN requires fully digital signal over copper wire.
So, digital to analog conversion is not required this is in the manner of the working of analog
channel. Two lines called B-lines are offered by most of the telephone companies. It offers the
user the flexibility to use different lines for voice and data, or both lines can be used for higher
data rates of 128kbps. B-ISDN offers transmission rates of 1.5mbps. It requires fibre optics
cable.
Speed: At the time of introduction approximately a decade ago, very significant speed advantage
was offered by ISDN over regular modems, which were further limited to 14.4 Kbps or slower.
At earlier time most of these connections did not exist. It was used by people who required faster
internet access and could not use the leased line. The connection range was approximately from
64kbps to 128kbps. But the speed of ISDN does not come close to that of options such as cable
of xDSL.
1.6.4 VSAT
VSAT (Very Small Aperture Terminal) is a satellite communications system that serves home
and business users. A VSAT user requires a box that interfaces between outside antenna with a
transceiver and the user's computer. A signal is send or received by the transmitter from the
satellite. The earth station is used to send and receive the satellite. Each end user is
interconnected with the hub station via the satellite in a star topology. For one end user to
communicate with another, each transmission has to first go to the hub station which retransmits
it via the satellite to the other end user's VSAT. VSAT handles data, voice, and video signals.
VSAT is signed up by user both by home users who uses a large service such as DirectPC and by
operating a leased line of their own by private companies such as VSAT systems. A number of
advantages over the terrestrial system is provided For private applications, companies can have
total control of their own communication system without dependence on other companies.
Business and home users also get higher speed reception than if using ordinary telephone service
or ISDN.
1.6.5 RF link
A radio frequency (RF) signal refers to a wireless electromagnetic signal used as a form of
communication, if one is discussing wireless electronics. Radio waves are a form of
electromagnetic radiation with identified radio frequencies that range from 3kHz to 300 GHz.
Frequency refers to the rate of oscillation (of the radio waves.) RF propagation occurs at the
speed of light and does not need a medium like air in order to travel. RF waves occur naturally
from sun flares, lightning, and from stars in space that radiate RF waves as they age. Humankind
communicates with artificially created radio waves that oscillate at various chosen frequencies.
RF communication is used in many industries including television broadcasting, radar systems,
computer and mobile platform networks, remote control, remote metering/monitoring, and many
more.
Wireless RF can be a fantastic option for providing high-speed links (up to 100Mb) between
offices in a multisite organization. It is also a very effective solution in providing broadband
speeds to remote locations or where cabling isn’t easy or available.
This technology will permit linking of company sites together for faster server/email/file access,
or even CCTV access. Wireless RF can also be used for a company’s primary internet
connection.
The benefits of this system are obvious to those customers who suffer because of their remote
location or that have a demand for significant traffic between satellite offices.
The TCP/IP model does not have session or presentation layers. No need for them was
perceived, so they were not included. Experience with the OSI model has proven this view
correct: they are of little use to most applications. On top of the transport layer is the application
layer. It contains all the higher-level protocols. The early ones included virtual terminal
(TELNET), file transfer (FTP), and electronic mail (SMTP). The virtual terminal protocol allows
a user on one machine to log onto a distant machine and work there. The file transfer protocol
provides a way to move data efficiently from one machine to another. Electronic mail was
originally just a kind of file transfer, but later a specialized protocol (SMTP) was developed for
it. Many other protocols have been added to these over the years that includes Domain Name
System (DNS) for mapping host names onto their network addresses, NNTP, the protocol for
moving USENET news articles around, and HTTP, the protocol for fetching pages on the World
Wide Web, and many others.
1.8.3 Services of TCP/IP
TCP/IP is a hierarchical protocol made up of interactive modules, each of which provides a
specific functionality. The modules are not necessarily interdependent. The OSI model specifies
which functions belong to each of its layers. The layers of the TCP/IP protocol suite contain
relatively independent protocols that can be mixed and matched depending on the needs of the
system. The term hierarchical means that each upper-level protocol is supported by one or more
lower-level protocols.
At the transport layer, TCP/IP defines three protocols: Transmission Control Protocol (TCP),
User Datagram Protocol (UDP), and Stream Control Transmission Protocol (SCTP). At the
network layer, the main protocol defined by TCP/IP is the Internetworking Protocol (IP); there
are also some other protocols that support data movement in this layer. The application layer in
TCP/IP is equivalent to the combined session, presentation, and application layers in the OSI
model. Many protocols are defined at this layer, some which are described below.
1.8.3.1 Simple Network Management Protocol (SNMP)
It is an Internet Standard protocol for collecting and organizing information about managed
devices on IP networks and for modifying that information to change device behavior. Devices
that typically support SNMP include cable modems, routers, switches, servers, workstations,
printers, and more. The main goal of SNMP is network monitoring for network management
tasks. A management information base (MIB) is maintained that contains entries in the form of
variables that describe the system status and configuration. Managing applications can query and
sometimes even manipulate these variables. It can monitor devices manufactured by different
companies working on different physical networks. It specifies the format of message that is
exchanged between manager and agents. SNMP frees management tasks from the physical
characteristics of devices from the network technologies they use. An important task of SNMP is
monitoring or managing a group of agents that is devices through an administrative device also
known as managers. Each managed system executes a software component called
an agent which reports information via SNMP to the manager. A network management on the
Internet consists of three key components SMI (Structure of Management Information), MIB
(Management Information Base) and SNMP. A typical example of SNMP is shown in Figure
1.6:
1.8.4.3 Addressing
TCP/IP assigns each computer on the network a unique address called its IP address. Thus, every
computer on the network is uniquely identifiable and information could be sent to it by simply
addressing its IP address. The present implementation of IP addressing is known as IPv4, while a
newer implementation supporting a much larger number of unique addresses called IPv6 is being
developed to replace IPv4.
1.8.4.4 Connection
Communication with TCP/IP starts with a connection being established between the two
computers. This is achieved in a systematic manner, called the three-way TCP handshake. The
computer initiating the communication sends a connection request packet to the other computer.
If the computer is the one with the correct IP address, it sends a packet back. If the first computer
receives that packet, it sends another one to the second computer, the reception of which by the
latter establishes a connection. The information is then exchanged using this established
connection, reducing the risk of the data being compromised.
Browser Vendor
Netscape Communications
Netscape Navigator
Corp.
Safari Apple
Client Programs – It describes the specific protocols have been designed to access a
particular service.
Figure 1.8 Architecture of a web browser
2.0 Objective
HTML, an acronym for Hyper Text Markup Language, specifies how the structure of a webpage
will be with the help of various markups. The following unit explains the core concepts of
HTML such as its structure, elements, attributes and core events. It also sheds light on block-
level elements and text-level elements. With the help of this unit, the reader will be able to
understand the basic elements used in HTML and their usage in the formatting of a webpage.
2.1 HTML
HTML, an acronym for Hyper Text Markup Language, specifies how the structure of a webpage
will be with the help of various markups. It is a structured markup language that is used to create
Web pages. Markup languages like HTML bundle together codes which are elements that are
used to represent the structure and format of a document. A user agent, usually a Web browser
which renders (delivers) the document, interprets the meaning of these codes to decipher
(making it into simpler human readable text) how to structure or display a document. The HTML
elements are made up of alphanumeric tokens surrounded by angle brackets, for example, <B>,
<HTML>, <IMG> and <HR> .
Almost all elements possess a pair of tags i.e. a start tag and an end tag. The start tag is a
mnemonic symbol for the element enclosed in ‘<’ ’>’, also known as angle brackets, for
instance, the symbol associated with bolding text is B and the start tag for this purpose is <B>.
An end tag is the same as that for a start tag, but with an exception that there exists a forward
slash preceding the text symbol of start tag: </B>. The instruction applied by an element
modifies whatever content is present between the starting and ending tags:
This is an example of a simple HTML document.
Example:
Sample of Heading 1
Sample of Heading 2
Sample of Heading 3
Sample of Heading 4
Sample of Heading 5
Sample of Heading 6
Example:
Output:
2.3.2 PARAGRAPHS
The <p> tag provides a means to structure our text into different paragraphs. Each paragraph
should write in between an opening <p> and a closing </p> tag as shown below in the example.
Example:
For our and others convenience, it is better to put few blank lines between paragraphs to edit in
future or on demand.
Example:
Output:
Example:
<b>boldface</b>
<u> underline</u>
<i>italic</i>
Output:
boldface
underline
italic
2.3.5 LISTS
In HTML, we can give number, unnumbered and lists to the different text using the simple tags.
We can also use nested lists with a list. HTML editor automatically takes the space between the
bullet or list number in a text, we do not need to mention it. Neither (as yet) do we have control
over what type of bullet will be used as each browser is different.
Unnumbered lists:
<ul> tag is use to unnumbered any list followed by the actual list items, which are marked with
the <li> tag. The list is ended with the ending tag </ul>.
<!DOCTYPE html>
<html>
<body>
<h2>Disc bullet with Unordered list </h2>
<ul style="list-style-type:disc">
<li>Ram</li>
<li>Shyam</li>
<li>Mahesh</li>
</ul>
</body>
</html>
Output disc:
Ram
Shyam
Mahesh
<!DOCTYPE html>
<html>
<body>
<h2>Circle bullets with Unordered list </h2>
<ul style="list-style-type:circle">
<li>Ram</li>
<li>Shyam</li>
<li>Mahesh</li>
</ul>
</body>
</html>
Output:
o Ram
o Shyam
o Mahesh
<!DOCTYPE html>
<html>
<body>
<h2> Square Bullets with Unordered list </h2>
<ul style="list-style-type:square">
<li>Ram</li>
<li>Shyam</li>
<li>Mahesh</li>
</ul>
</body>
</html>
Output:
Ram
Shyam
Mahesh
Numbered lists
Similar example given here using a numbered list format:
Example Numbers:
<!DOCTYPE html>
<html>
<body>
<h2>Numbers are used for Ordered List</h2>
<ol type="1">
<li>Ram</li>
<li>Shyam</li>
<li>Mahesh</li>
</ol>
</body>
</html>
Output:
1. Ram
2. Shyam
3. Mahesh
<!DOCTYPE html>
<html>
<body>
<h2>Letters are used for Ordered List </h2>
<ol type="A">
<li>Ram</li>
<li>Shyam</li>
<li>Mahesh</li>
</ol>
</body>
</html>
Output:
A. Ram
B. Shyam
C. Mahesh
<!DOCTYPE html>
<html>
<body>
<h2> Lowercase Letters are used for Ordered List </h2>
<ol type="a">
<li>Ram</li>
<li>Shyam</li>
<li>Mahesh</li>
</ol>
</body>
</html>
Output:
a. Ram
b. Shyam
c. Mahesh
This is an example of roman letters.
Example Roman letters:
<!DOCTYPE html>
<html>
<body>
<h2> Roman Numbers are used for Ordered List </h2>
<ol type="I">
<li>Ram</li>
<li>Shyam</li>
<li>Mahesh</li>
</ol>
</body>
</html>
Output:
I. Ram
II. Shyam
III. Mahesh
2.3.6 BLOCKQUOTE
For a long quotation in the text, we can use a < blockquote > tag and the text enclosed within this
tag indicates an extended quotation. Blockquote texts are generally rendered by the browser as
indented text. It looks like this:
<blockquote>...</blockquote>
The <title> is an important tag which required to shown the title of the HTML documents and it
only contains text and other tags containing in the title are ignored. The title is displayed in the
browser’s toolbar. It also shows the favorite pages title which we added during browsing and in
search-engine results title.
Example:
<!DOCTYPE html>
<html>
<head>
<title> First HTML script for web page </title>
</head>
<body>
First HTML script for web page
</body>
</html>
Output:
Footer definition and Usage
The <footer> tag in HTML represents a footer for a document or section. A <footer> element
generally contains information about its author, copyright data or links to other related
documents. You can have several <footer> elements in one document.
Example:
<!DOCTYPE html>
<html>
<body>
<footer>
<p>Posted by: xyz</p>
<p>Contact information: <a href="mailto:xyz@yahoo.com">xyz@yahoo.com</a>.</p>
</footer>
<p><strong>Note:</strong> The footer tag is supported only from Internet Explorer 9 and later
versions.</p>
</body>
</html>
Output:
Example:
<!DOCTYPE html>
<html>
<body>
<p> Example of a simple text.</p>
<p><b> Example of a bold text.</b></p>
</body>
</html>
Output:
<!DOCTYPE html>
<html>
<body>
<p>Example of a simple text.</p>
<p><i>Example of a italic text.</i></p>
</body>
</html>
Output:
Example:
<!DOCTYPE html>
<html>
<body>
<h2>HTML <small>Small</small> Formatting</h2>
</body>
</html>
Output:
Example:
<!DOCTYPE html>
<html>
<body>
<h2>HTML <mark>Marked</mark> Formatting</h2>
</body>
</html>
Output:
The HTML <del> tag used to highlight the deleted (removed) text.
Example:
<!DOCTYPE html>
<html>
<body>
<p>The del tag defines deleted (removed) text.</p>
<p>I like to play <del>Cricket</del> Football.</p>
</body>
</html>
Output:
2.6 Text Style
The appearance of an HTML page can be changed with the style attribute.
The syntax of the HTML style attribute is given below:
<tagname style="property:value;">
The property is a CSS property (Cascading Style Sheet, used for enhancing the look of any
document). The value is a CSS value.
Example:
<!DOCTYPE html>
<html>
<body style="background-color:powderblue ;">
<h1>Example of Background Color changing.</h1>
<p>Example of Background Color changing.</p></body>
</html>
Output:
Example:
<!DOCTYPE html>
<html>
<body>
<h1 style="color:blue;">Example of Blue color text.</h1>
<p style="color:red;">Example of Red color text.</p>
</body>
</html>
Output:
Example:
<!DOCTYPE html>
<html>
<body>
<h1 style="font-size:300%;">The font size is very large.</h1>
<p style="font-size:160%;">The font size is big.</p>
<p style="font-size:60%;">The font size is small.</p>
</body>
</html>
Output:
2.6.4 HTML Text Alignment
For alignment of the text of HTML pages, there are four text-align property (left, center, right
and justify) that are frequently used. It defines the horizontal text alignment for an HTML
element. The example given below shows the method for center alignment text:
Example:
<!DOCTYPE html>
<html>
<body>
</body>
</html>
Output:
Output:
Example:
Output:
Example:
Output:
In the beginning, graphics was not supported by the web pages only texts are used. But later on
images and other types of multimedia files are embedded with web pages. The graphics are
embedded in a HTML pages using a simple tag which is represented by <IMG>. We can also
embed the images inside other elements such as anchors. When embedded inside an anchor, then
the user left clicks on the image, they will go to the designated link (rather, their browser will
load a file from the designated link). The <IMG> element has no ending tag. The syntax of
embedding an image is follows:
<img src=”tree.jpg”>
Here, src attributes defines a path pointing to the image from where we want to embed.
IMG Attributes
Output:
2.8 Tables
Example:
<!DOCTYPE html>
<html>
<Body>
<table border="1">
<tr>
<th>Student Name</th>
<th>Subject</th>
<th>Marks</th>
</tr>
<tr>
<td>Ram</td>
<td>HTML</td>
<td>87</td>
</tr>
<tr>
<td>Shyam</td>
<td>HTML</td>
<td>73</td>
</tr>
</table>
<Body>
</html>
Output:
Tag Description
<table> Displays a table
<th> Represents a header cell in a table
<tr> A row in a table
<td> A cell in a table
<col> Specifies column properties for each
column within a <colgroup> element
<caption> A table caption
<colgroup> Specifies a group of one or more
columns in a table for formatting
<thead> Groups the header content in a table
<tbody> Groups the body content in a table
<tfoot> Groups the footer content in a table
Example:
<html>
<body>
<table style="width:100%">
<tr>
<th>Student Name</th>
<th>Subject</th>
<th>Marks</th>
</tr>
<tr>
<td>Ram</td>
<td>HTML</td>
<td>87</td>
</tr>
<tr>
<td>Shyam</td>
<td>HTML</td>
<td>73</td>
</tr>
<tr>
<td>Ghanshyam</td>
<td>HTML</td>
<td>67</td>
</tr>
</table>
</body>
</html>
Output:
2.8.4 HTML Table - Adding Cell Padding
To manage the spaces between the cell of a table and its border, we use Cell padding tags. If we
do not mention a padding, the table cells will be displayed without padding. This is an example
of a cell padding.
Example:
<!DOCTYPE html>
<html>
<head>
<style>
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
th, td {
padding: 20px;
}
</style>
</head>
<body>
<table style="width:100%">
<tr>
<th>Student Name</th>
<th>Subject</th>
<th>Marks</th>
</tr>
<tr>
<td>Ram</td>
<td>HTML</td>
<td>87</td>
</tr>
<tr>
<td>Shyam</td>
<td>HTML</td>
<td>73</td>
</tr>
<tr>
<td>Ghanshyam</td>
<td>HTML</td>
<td>67</td>
</tr>
</table>
<p>Try to change the padding to 15px.</p>
</body>
</html>
Output:
In a web page, several links are used to directly access the other pages or other parts of a given
page. These links are also known as hyperlinks which allows user to switch between different
web pages. When we move the mouse over a link, the mouse arrow will turn into a little hand.
Note: A link does not have to be text. It can be an image or any other HTML element.
Other tags
<a> tag is an anchor tag which represents a link to reach the new linked document.
href attribute is used to link the address of the web pages by url.
target attribute to define where to open the linked document
<img> tag (inside <a>) to use an image as a link
id atribute (id="value") to show a bookmarks in web page
href attribute (href="#value") to link to the bookmarks
<a href="/html/default.asp">HTML tutorial</a>
Example:
<!DOCTYPE html>
<html>
<body>
<p><a href="https://www.google.com">Visit google website</a></p>
</body>
</html>
Output:
2.10 Frames
In HTML pages, frames allow multiple views to the user and we can browse window into
multiple sections with a separate HTML document. A browser contains many frames in a
window which is known as a frameset. The window frames are divided into rows and columns
in similar way as table are organized.
Disadvantages of Frames
Due to some major drawbacks of frame in window, it is never recommended to use frames in
our webpages −
In smaller screen, frames do not cop-up properly because their screen is not big enough
to be divided up.
Sometimes our page will be displayed differently on different computers due to different
screen resolution.
The browser's back button might not work as the user hopes.
There are still few browsers that do not support frame technology.
Creating Frames
To use frames on a page we use <frameset> tag instead of <body> tag. The <frameset> tag
defines how to divide the window into frames. The rows attribute of <frameset> tag defines
horizontal frames and cols attribute defines vertical frames. Each frame is indicated by <frame>
tag and it defines which HTML document shall open into the frame.
2.11 Summary
HTML is a structured programming language (Structured programming is paradigm aimed at
improving the clarity, quality, and development time of a computer program) which provides a
set of rules for correct application of elements. The browser renders (display) the HTML code
for correct representation and orientation of content. At times, the rules laid down in HTML are
interpreted differently by browser which provides the programmers an opportunity to exploit this
vulnerability. HTML is essentially a tag-based language. The documents start with the
<! DOCTYPE> tag. The entire document is encapsulated within <HTML> (opening and closing)
tags. The document is further divided into header and body sections specified by <HEAD> and
<BODY> tags, respectively. The header section is used to provide the descriptive information
related to the web document and needs to contain the <TITLE> tag to define the title of the page.
The body section of the web document contains information regarding placement of various
elements of the document. Block-level elements, text-level elements, and special-character
entities are used to structure it. Some tags are used for providing certain logic and the others are
for physical representation. The HTML elements discussed so far are of basic nature and are
widely used over all systems. They are utilized to customize the document presentation.
However, a complete look of the web document cannot be achieved simply using these basic
tags.