V Sem

B.Com.
V Semester 1
III YEAR – SEMESTER-V
PAPER-VI: WEB TECHNOLOGY
UNIT -1
Introduction to Internet: Definition of Internet – History of Internet – Advantages & disadvantages of

Internet – Tools of internet - How internet works. Introduction to WWW: Definition of WWW –WWW
tools - Web Terminology – web browser – web server .
UNIT-2
E-Mail: Definition of e-mail – advantages & disadvantages of e-mail – how to work with e-mail accounts –
e-mail inner working : Store and forward method – message components – message composition – features
of e-mail. Protocols: TCP/IP - HTTP
UNIT -3
Introduction to HTML: Basic HTML – HTML document structure – HTML tags – Basefont tag – title tag –
body tag – Text formatting tags – Character tags
HTML Lists: Ordered List , Unordered List & Definition List – Using colors – Using Images
UNIT – 4
Horizontal Rule Tag - HTML Tables – Nested Tables - Hyperlinks: Textual, Graphical Links to sections –
Frames – Nested Frames – Forms – Form Controls: textbox, checkbox, radio button, select, text area -
Processing of forms
UNIT – 5
Advanced HTML: Cascading Style Sheets: Introduction – Using Styles: As an attribute, tag & external file
– Defining Your own styles – Properties and values : properties related to Fonts , Backgrounds & colors,
text , boxes & borders
Paper VI: WEB TECHNOLOGIES Prepared by Mahesh MCA

B.Com. V Semester 2
UNIT -I
1. What is network? What are the advantages and disadvantages of net work?
Inter connection of computers is known as network. Internet is used to share resources,

exchange files, or allow electronic communications. The computers on a network may be
linked through cables, telephone lines, radio waves, satellites, or infrared light beams.
Computers on a network are called nodes.
Computer Networks can be classified into the following types:

1. Wired network
2. Wireless network
Network
Wired Network Wireless Network
WLAN
LAN MAN WAN
Wired network: Whenever interconnection of computers has been done with the help of
cables known as wired network. Based on distance wired network has been classified
into following types.
 Local area network(LAN)

 Metropolitan area network(MAN)
 Wide area network(WAN)
Local Area Network (LAN)

 Interconnection of computers which are existing inside a building is known
as LAN.
 It is also called LAN and designed for small physical areas such as an office, group
of buildings or a factory.

B.Com. V Semester 3
Metropolitan Area Network (MAN)

 Interconnection of computers which are existing in a city is known as MAN.
 It is designed for a town or city.
 This type of network spread over a city.
 Cable TV network is an example of metropolitan area network.
Wide Area Network (WAN)

 Interconnection of computers within wide range of area known as Wide Area
Network.
 With the help of WAN, share the information in the world wide.
Advantages
 Sharing devices such as printers saves money.
 Site (software) licenses are likely to be cheaper than buying several standalone
licenses.
 Files can easily be shared between users.
 Network users can communicate by email and instant messenger.
 Security is good - users cannot see other users' files unlike on stand-alone
machines.
 Data is easy to backup as all the data is stored on the file server.
Disadvantages
 Purchasing the network cabling and file servers can be expensive.
 Managing a large network is complicated, requires training and a network
manager usually needs to be employed.
 There are more chances of network failures.
 Viruses can spread to other computers throughout a computer network.
There is a danger of hacking, particularly with wide area networks. Security procedures
are needed to prevent such abuse. e.g.: a firewall.

B.Com. V Semester 4
2. What is Internet? Explain its features.
Definition:
Internet is a World Wide Network of computer networks. It connects millions of computers
across the network. The Internet is a virtual space in which users send and receive mails, access
remote computers, browse information on the web etc.
Advantages:
1. Communication:
The major target of Internet is always will be the communication. We can communicate in a
fraction of second with a person who is located at any part of the world.
2. Information:
Information is the biggest advantage of Internet. Internet is a huge collection of information that
is presented in various formats spread over several computers.
3. Entertainment:
Entertainment is another popular reason why many people browse the Internet. Internet has
become successful for attracting entertainment sector.
4. Services:
Many services are now provided on the Internet such as online banking, job seeking, reserving
tickets etc.
5. E-Commerce:
E-Commerce is the concept used for any type of commercial or business deals that involves
transfer of information across the globe via Internet.
6. Easy searching:
Number of search engines like yahoo, google etc. available on the internet and you can search
any item, events, methods etc.
7. 24 hours a day – 7 days a week – 365 day per year:
Internet given 24x7x365 work scheme i.e. Even if no staff were to be in your office , visitors will
come to your website. The website never closes.
8. Ocean of knowledge:
Internet is the Ocean of knowledge, that you can access any information about every field within
second, you can access the information regarding computer, business, medicine, Technologies
etc.

B.Com. V Semester 5
Disadvantages:
1. Theft of personal information: If you use the internet you may be facing grave danger as
your personal information such as name, address, credit card number, etc. can be accessed by
other culprits to make your problems worse.
2. Spamming: spamming refers to sending unwanted e- mails in bulk , which provide no
purpose and needlessly obstruct the entire system.we should make an effort to try and stop
these activities so that using the internet can become that much safer.
3. Data Theft:
While transforming data over the Internet, there is a chance of data theft, that is some
unauthorized users may use our private information such as credit card numbers, passwords
etc.
4. Virus:
Viruses are computer programs that spoil the normal functionality of the computer systems.
Computers connected to the Internet are more prone to virus attacks.
5. Piracy:
By using the internet some persons download the freely available data, movies, songs
etc. material that actually violate the copy right act and promote the piracy.
3. Explain the History of the Internet:
 In the year 1969, Advanced Research Project (ARPA) of the U.S. Department of
defense along with a team of University research scholars, began connecting
computers at different universities and defense contractors.
 The goal of this project was to create a very large computer network which has no
geographical boundaries.
 This was the first network in the world.
 This network include multiple paths i.e. multiple communication channels or
links. If one link fails, still data can be transmitted through any of the other
available alternative link/path.
 This made this network stable enough to survive from disasters.
 It became link a network for data communication that may never fails.
 This network was named “ARPANET” initially. Later on , this network helped to
develop a new network concept called “Internet”. Internet also popularly called as
“NETWORK OF NETWORKS”.
 Started with a dozen of Networked computer systems of universities and
institutions, allowing computers to be shared.
 Allowing fast communication between researchers through Emails.
 Only people in the government, military and academic had access to the network.
 In 1991, the National Science Foundation (NFS) gradually started backing off from
its subsidy of the backbone network, and then allowed commercial access to the
internet.
 With commercial access to the Internet, businesses and all kinds of agencies
began to use the Internet to communicate, exchange data and distribute
information;

B.Com. V Semester 6
 A host of businesses called Internet Service Providers (ISPs) sprang up. ISPs
provide dialup access to the Internet; an individual or a business opens an
account with the ISP, dials into the ISP's computer and via the ISP's computer
connects to the Internet.
o Some examples for ISP are:
o VSNL – Videsh Sanchar Nigam Limited
o TATA BRAOADBAND
o RELIANCE BROADBAND
o AOL – AMERICA ONLINE etc.
 Internet traffic grew,
o Many businesses spent heavily to improve the internet, therefore to better
service their customers.
o Big competition among communication carriers, hardware and software
suppliers.
o As a result, Internet‟s bandwidth climbed high, & cost went down!
4. Explain the Tools of Internet (or) Define World Wide Web (WWW)
Definition: -
The definition of internet was formed by the federal network council (F.N.C), “The
internet is a global system of networked computers together with their users and data”.
Global means the people from all over the world can connect to it. We can access the
information quickly and easily.
Internet tools are:
1. E-Mail
2. News Groups
3. Mailing Lists
4. FTP, Telnet
5. IRC, ICQ
6. WAIS
7. Gopher
8. WWW(World Wide Web)
E-mail: e-mail is one of the most popular services of the internet. It permits internet
users to send and receives messages and files to another user via modems. E-mail uses
a number of internet protocols, including SMTP (Simple Mail Transfer Protocol), MIME
(Multi-purpose Internet Mail Extension) and POP (Post Office Protocol).

B.Com. V Semester 7
News Groups: News Groups are discussion forums where articles get posted as topics
and replies get posted to create a thread. A thread is the series of responses in a news
groups.
Mailing Lists: A mailing list a group of users with a shared interest whose email
addresses are collected together in an electronic list that can be used to send email to
each member on the list. The key to a mailing list is a program called a list server,
which receives and distributes posting, and automatically manages subscriptions. The
three famous list server software –LISTSERV, LISTPROC,MAJORDOMO
Telnet: Telnet is a utility that allows users to login into remote system just as through
they were logging into local system.
FTP: FTP is an application protocol for exchanging files between the computers over the
internet. An FTP site contains books, articles, software, games, images, sounds,
multimedia courses etc..,
IRC: IRC (Internet Relay Chat) is the service in which participants around the world can
talk to each other in real time on hundreds of channels.
I.C.Q (I Seek You): ICQ is simple and smart way of getting in touch with people. This
small program takes up the complicated work of finding friends, colleagues and people
with similar interest across the globe for the users.
WAIS (Wide Area Information Service/Search) : It allows users to search for specific
data in which they are interested in „WAIS‟ searches the documents in a list of servers
for one (or) more keywords and reports back to the users.
Gopher: Gopher is a protocol that is used to search and retrieve information which is
stored on various websites on the internet in a hierarchical manner. It is a text menu
interface that enables to view the hierarchy of information using menus.
5. Explain how internet works

The internet is a network that connects thousands of individual computer networks.
Each computer on the internet has unique address. These addresses referred to as
number, which is called IP address or name, is called „Domain Name‟. For example, IP
address: 192.65.245.76 and domain name: gminformatics.com.
Everything that is sent across the internet is a „packet‟ of data. Your e-mail, your live
charts, your web searches and FTP sessions are all packets of data. The reason
computers of vastly different manufacture can exchange data is due to a set of
standards called „protocol‟. Protocol is like rules that govern the exchange of
information.

B.Com. V Semester 8
These protocols make it possible for one computer to translate its data into a form
readable to all computers and send the dat out on its way. The data arrives at its
destination and protocol steps in to translate the data from the general format of the
internet into the format acceptable to this computer.
The two primary protocols of the internet are – Transmission control protocol (TCP) and
Internet Protocol (IP).
TCP breaks your data up into small packets which are passed along from one network to
another until they reach their destination. At the destination the TCP protocol
reassembles the packets into the message. If packets are lost or damaged along the way
a request is sent back to the source for replacements.
The internet is a packet – switch network. The emphasis is on exchanging packets of

data rather than connecting computer systems together. The networks on the internet
uses hardware devices called „Router‟. The Router on a network accepts packets
addressed to it and passes on packets addresses to other networks. Each computer
system with a direct connection to the internet must have the hardware / software to
allow it to work with packets.
Many internet services and tools operate on a scheme called „client / server „ A person
on one computer starts a program that contacts another computer. The client is the
program the person is running on the first computer and the server is running on the
remote computer. The person gives commands to his client software and the „Server’
sends back the reply to the command. Usually a server can deal with several clients.
6. Explain World-Wide Web (WWW)

The World-Wide Web (WWW) is a pair of software applications, which allow both
distribution of and access to information on the Internet. The web is not the Internet but
a means of distributing and accessing the information that is on it.
History of the World-Wide Web
 WWW allows computer users to locate and display multimedia-based documents,
 Introduced in 1990 by Tim Berners-Lee of CERN (Geneva).
 Today‟s Internet mixes computing and communications technologies.
 It makes our work easier.
 It is changing the nature of the way business is done.
 It makes information instantly and conveniently available to anyone with a
connection
 Communities can stay in touch with one another.
 Researchers can learn of scientific and academic breakthroughs worldwide.
Web browser:

B.Com. V Semester 9
The web client, called a browser, is the software that allows you to interact with
information available on the Internet. e.g Netscape Navigator, Microsoft Internet
Explorer, MOSAIC.
Web Server:
 Stores and transmits web documents (files). It uses the HTTP protocol to connect
to other computers and distribute information.
 Example: IIS, Apache, Sun Java System Web Server
Web Page:
A mixture of text, graphics, sound and animation in the HTML format, to make
information accessible in a easy to understand format using the Internet.
Web Site:
A collection of web pages connected (linked) by Hypertext clickable links.
Web Site Storage/Hosting:
After a web site is designed it must be stored on a computer that can be accessed
through the Internet and the World-Wide Web .
What is web browser? Explain different types of Web Browsers
A web browser is an interface that helps a computer user gain access to all the content that is on the
Internet and the hard disk of the computer. It can view images, text documents, audio and video files,
games, etc. When the browser is used for browsing web pages, the pages may contain certain links
which can be opened in a new browser. Multiple tabs and windows of the same browser can also be
opened. There are four leading web browsers: Explorer, Firefox, Netscape and Safari but there are
many others browsers available.
Netscape
Netscape is one of the original Web browsers. This is what Microsoft designed Internet Explorer to
compete against. Netscape and IE comprise the major portion of the browser market. Netscape was
introduced in 1994.
Internet Explorer
Internet Explorer (IE) is a product from software giant Microsoft. This is the most commonly used
browser in the universe. This was introduced in 1995 along with Windows 95 launch and it has passed
Netscape popularity in 1998.

B.Com. V Semester 10
Safari
Safari is a web browser developed by Apple Inc. and included in Mac OS X. It was first released as a
public beta in January 2003. Safari has very good support for latest technologies like XHTML, CSS2
etc.
Firefox
Firefox is a new browser derived from Mozilla. It was released in 2004 and has grown to be the second
most popular browser on the Internet.
Opera
Opera is smaller and faster than most other browsers, yet it is full- featured. Fast, user-friendly, with
keyboard interface, multiple windows zoom functions, and more. This browser is available in Java and
non Java-enabled versions.
Google Chrome
This web browser was developed by Google. Its beta and commercial versions were released in
September 2008 for Microsoft Windows. It has soon become the fourth-most widely used web
browser. The browser options are very similar to that of Safari, the settings locations are similar to
Internet Explorer 7, and the window design is based on Windows Vista.
What is World Wide Web?
Web is a collection of electronic resources. A recent but revolutionary development on

the internet is the World Wide Web (WWW).
World Wide Web: (also called as W3 or simply as WEB)
 The World Wide Web or the web is a component of the internet that provides
access to large amounts of information stored on many different web servers.
 The web also provides access to many of the services available on the internet.
 The fundamental unit of the web is the Web page.
 The web Page is a hyper Text document that contains links to other related Web
Pages, graphics and audio files etc.
 Web page also contains links to other Internet services such as File Transfer
Protocol (FTP) and E- mail.
 The process of developing Web Pages will be performed by a WEB DESIGNER.
 Web pages are created by using Hyper Text Markup Language (HTML) or JAVA or
Active Server pages (A.S.P) etc. languages.
 Combination of web pages is called as WEB SITE.
 All web pages are uploaded to WEB SERVERS by a process called DATA
PUBLISHING.
 This also means WEB SERVERS are hosting all the web Pages.
 WWW provides unique identification code to each website called URL
 URL stands for Uniform resource Locator, which is simply means site address.
 Web pages reside on servers called as WEB SERVERS which will have special
software that allow users to access web pages and other related services.
 But to retrieve any web page user must know the URL of such web site.
 Several millions of web servers are currently connected to the internet.
 A user can directly access any web page on one of these servers and then follow
the other related links
 The process creates a web of millions of links around the world and, thus, the
name, World Wide Web.
 To view a Web page, the user must use a special client software package called
“Web Browser”.
.

UNIT -II
1. What is e-mail? Explain its advantages and disadvantages
Definition:
The ability to compose, send and receive messages called mails electronically over
the Internet is called „e-mail‟.
E-mail:
E-mail is one of the most popular services available through the Internet. In the early
days of the Internet, e-mail emerged as an inexpensive and efficient means of
communication between researchers, scientists, people in high-tech jobs and those in
academic. People can now receive and sent e-mail to:
 Nearly any country in the world.
 One of millions of computer users.
 Many users at once.
 Computer programs
Advantages of E-mail:
 Convenience: There no need to go to post office, search for stationery and stamps.
E-mail makes publishing and discussing very easy. Sending a memo or short note
is easy. Message can be formal or informal.
 Speed: E-mail is fast, based on the speed of the underlying communication
network.
 Inexpensive: Once we are on-line, the cost of sending a message is small.
 Printable: A hard copy is easy to obtain. We can keep an electronic copy of a
message for our own records.
 Reliable: Although messages are occasionally lost, this is rare. Many mail
systems will notify the sender if an e-mail message was undeliverable.
 Global: Ever increasingly, people and businesses all over the world are using e-
mail.
 Generality: E-mail is not limited to text; it allows the transfer of graphics,
programs and even sounds.
Disadvantages of E-mail:
 Misdirection: It is far more likely that you will accidentally send e-mail to an
unintended recipient than it is for someone actually to intercept your e-mail.
 Interception: Never send an e-mail message that you would not want the whole
world to see. It is simple for someone to pass on your message, called e-mail
forwarding, to another party.
 Forgery: E-mail does not prevent forgeries, that is, someone impersonating the
sender, since the sender is usually not authenticated in any way.
 Overload: E-mail can also be too convenient and result in a flood of mail.

 Junk: Junk e-mail is an undesirable or inappropriate e-mail also called as Spam.

The process of sending junk e-mail to lots of sites simultaneously is known as
spamming.
 No response: This occurs with recipients who do not read and respond to their e-
mail on a regular basis and due to regular postal mail as well.
 Limited to literate only: This facility is limited to literate people only. That is,
uneducated people cannot use emails on their own.
2. Explain how to work with e-mail accounts (User IDs, Passwords and e-mail Addresses)
Userids:
A computer system uses userids and passwords together to grant access to the system. The userid identifies
you to the computer. Userids are typically some form of your name ( Mahesh MCA). A userid must be
unique throughout the computer system. This allows the computer to differentiate between you and some
other person. Different systems refer to a userid with different names.
 Login ID
 Username
 Userid
Since the userid identifies you to the computer, it also is used to identify you to other computer systems.
The userid is made up of the person's initials and the digits of some personal identification number.
User ID Rules:
 User IDs must be 7-14 characters.
 User IDs must contain at least one letter; numbers are allowed, but not required.
 User IDs cannot contain spaces.
 User IDs cannot contain your Social Security Number, Tax Identification Number, or Customer
Access Number.
 No special characters are allowed, such as:(! , @, #, $, %, ^, & ).
 Use of an underscore is allowed but not required
 Do not use your Password as your User ID
Note: You cannot change your User ID once it is established.
Passwords:
Your password is a secret code that authenticates you to the computer. While using
passwords a computer system requires the following conditions to be met, as a security
measure. Hence, a good password is:
Password Rules
 Passwords must be 7-16 characters depends on system setup.
 Passwords must include at least one letter and one number Passwords cannot contain spaces
 Semicolons cannot be part of a Password.
 Passwords are case-sensitive.
 Do not use your User ID as your Password.
If you forget your User ID or Password, you can retrieve them through the "User ID & Password Help" link
E-mail Addresses:
The basic form of an e-mail address is as follows
[email protected]

The text before the @ sign specifies the username of the individual, while the text after
the @ sign indicates how the computer system can locate that individual‟s mailbox.
Example: [email protected]
In the above mail address maheshmca is the user name gmail is the host name and ‘.com’ is the domain
name.
The number of periods (.) varies from e-mail address to e-mail address. Most address
have either one or two dots. For example:
[email protected]
This address has a top-level domain of com. The com stands for commercial. A given
field in an e-mail address, i.e., apart from dot can be 63 characters long. All fields
combined must be less than 256 characters.
Domain Names:
The big seven generic top-level domain names are com, edu, gov, int, mil, net and org.
Every country has its own top-level domain name. They are called as country codes. In
total, including all country codes, there are about 150 top-level domain names. The
following figure shows the organizations of the domain names:

4. Describe in detail E-mail Inner Working

Email is based around the use of electronic mailboxes. When an email is sent, the message is routed from
server to server, all the way to the recipient's email server. More precisely, the message is sent to the mail
server tasked with transporting emails (called the MTA, for Mail Transport Agent) to the recipient's MTA.
On the Internet, MTAs communicate with one another using the protocol SMTP, and so are logically called
SMTP servers (or sometimes outgoing mail servers).
The recipient's MTA then delivers the email to the incoming mail server (called the MDA, for Mail
Delivery Agent), which stores the email as it waits for the user to accept it. There are two main protocols
used for retrieving email on an MDA:
POP3 (Post Office Protocol) - Which is used for retrieving email and, in certain cases, leaving a copy of it
on the server.
IMAP (Internet Message Access Protocol) Which is used for coordinating the status of emails (read,
deleted, moved) across multiple email clients. With IMAP, a copy of every message is saved on the server,
so that this synchronization task can be completed.
MTAs act as the post office (the sorting area and mail carrier, which handle message transportation), while
MDAs act as mailboxes, which store messages (as much as their volume will allow) until the recipients
check the box. This means that it is not necessary for recipients to be connected in order for them to be sent
email.
To keep everyone from checking other users' emails, MDA is protected by a user name called a login and by
a password.
Retrieving mail is done using a software program called an MUA (Mail User Agent). When the MUA is a
program installed on the user's system, it is called an email client (such as Mozilla Thunderbird, Microsoft
Outlook, Eudora Mail, or Lotus Notes). When it is a web interface used for interacting with the incoming
mail server, it is called webmail.

5. Explain briefly about the message components?
When a mail reaches a mail box, most of the email clients (before reading the email) will
see a list of messages –
 Date – it indicates on which date the Email was sent.

 Sender name – it indicates from whom we received this email
 Size in bytes – it indicates the number of bytes occupied by the email and its
attachment in mail box.
 Subject line – for which purpose the email was sent to the sender is represented by
this attribute.
Some additional symbols are used to flag whether or not the client already viewed the
message or it contains of an attachment or not. Every e-mail message consists of the
following component.
Header From: V.S.University <[email protected]> Tue Aug 28 2014
Date : Tue Aug 28 2018 12:00 IST
To : [email protected]
Subject: regarding to examination time table
CC : [email protected]
bcc :
Greeting Dear sir,

B
o
Text Relevant message
d
y
Control of the Examinations,

Signature
V.S.University
Nellore.
Header: In general header part of an E-mail message includes the following fields. They
are

 The From field indicates who sent the message and when. In this case
V.S.University, whose address is [email protected], send the message on
Tuesday August 28, 2018 at 12:00 noon Indian Standard Time.
 The Date field repeats the date and time according to GMT.
 The To field specifies to whom the message was sent. In this case the recipient is
[email protected].
 The subject field provides a hint as to what the message is about.
 The CC field is used to send the “Carbon Copy” of the message to another user
 The BCC (which stands for blind carbon copy) field was used; we would not see it
in the header part. It is used when the user do not want one or more recipients to
know that someone else was copied on the message.
The Greeting, Text, and Signature form the body of the message. Most of email clients
recognize the header and body divisions of email message.
Greetings: How to address the recipients is mentioned in this section

Text: It is actual part of the email message.
Signature: it holds the complete information of the sender
6. Discuss about message composition.

The manner in which you compose an email message may vary from one mail program to
another. However the basic elements remain the same, if you are composing your email outside
the mailer using a simple text editor.
Structure
When composing an email message within a mailer, it will “prompt” you for certain information.
If you select “compose” button or command, the following format is displayed.
To
Subject
CC BCC
Attachment
Send Spell Check Cancel

 Open Web Browser (Ex: Internet Explorer, Google Chrome, Firefox).

 Type the Domain name in the address field (Ex: yahoomail.com,gmail.com) and press Enter Key.
 Enter your User id and Password and click on Sign In Button. It will open your
o e-mail ID.
 Click on Compose (or) New Message (or) Write Message.
 Type the E-mail address in the To Field in the Header. If you want to enter multiple addresses by
separating them with a comma.
 Enter E-mail address of any one you want to receive a copy of the message in the CC Field. (A
recipient who is able to see and correspond with the other recipients of the message).
 In the BCC Field type the E-mail addresses you want to receive a copy of the E-mail. (The E-mail
addresses of recipients who are BCC will not appear in the headers of the message.)
 Type the brief description of the E-mail message in the Subject Field.
 Write the Actual content of the message in the Body.
 Click on Send Button.
To – here you should enter the email address of the person to whom you are sending the
message.
Subject – it is the main part of the email, in which we enter a short description of your
message.
Cc/Bcc– this field is to enter an email address to send the same message to multiple
recipients. In mailer‟s, it will allow you to enter a list of names, separated by commas,
on the cc/bcc box.
Attachment – this field is necessary when the user wants to sent a file along with the e-
mail. After this, a text editor will be appeared. In this editor we can put our message
and/or modify the message.
Netiquette
Informal rules of network etiquette or netiquette, when you are sending emails you
can able to express your message graphically or symbolically. These are different
expressions in Internet, for example emotions such as smiley face- , sorrow face- etc.
Composition
For sending e-mails to friends or people you know, simply type the message and
send it. For people you do not know, be slightly more formal and proofread your
message. For every message we can able to use spell checking to avoid mistakes.
After composing your message using the text editor and you are ready to send.
Again for important correspondence you would like to keep a record it is good idea to
use CC option.

7. Explain the mailer features (features of e-mail)
A mailer is an application program used to compose, manipulate and send email.
The best way to earn how to use mailer effectively is to experiment with it. You should
also read the online documentations, as you will usually get some knowledge about
mailer features. In mailer feature a series of commands are available such as compose,
copy, delete, edit, file, forward, next, and reply.
Compose, File and Replay:
A compose command typically provides the following features-
 New – compose a message

 Reply – reply to the current message, which we received from a sender.
 Forward – passes the message on to a specified mail address or group of mail
address.
 Vacation – a program, which automatically generates responds to the received
emails and saving the received emails in the mailbox when the user is not in
station.
A file command has the following functionality –
 Save – save the current message into a file

 Insert – include a file in the body of the email message being composed
 Exit – quit or leave the mailer
 Open – open a file from the disk which has already saved.
 Attach – append a file to a message (files such as text, movie, picture etc)
A replay command usually consists of the following items –
 To sender – sends a reply message to the sender or group who sent us email
 To all – sends a reply message to a group of users who sends mails to us.
 Forward – forwards email message to the specified email address
 Include – when replaying to a message we must remember that a period of time
elapsed since received the message.
Forwarding –
User may have more than one email accounts; it is very difficult to read the mails
from different accounts. Instead of reading mail from two or more different accounts, it
is often more convenient to have all emails directed to only one account. This is possible
with the help of forward command.

8. What is PROTOCOL? Explain TCP/IP and HTTP protocols
It is a set of conventions governing the processing and especially the data in an

electronic communications system.
TCP/IP (Transmission Control Protocol/Internet Protocol ):
TCP/IP is a set of protocols developed to allow cooperating computers to share

resources across a network. They provide a few basic services that everyone needs (file
transfer, electronic mail, remote logon, etc…) across a very large number of client and
server systems.
Hypertext Transfer protocol (HTTP)?
The protocol used to transfer information on the World Wide Web. Web servers
and clients communicate with each other via the platform - independent HTTP.
HTTP Sessions (steps):
 Make the connection

 Request a document
 Respond to a request
 Close the connection
Connection Setup: The browser opens a standard TCP connection to the server. Port 80
is used by default but any port which is not required by other applications can be used.
In non-standard port is used, both the client and server must be aware of it. When ports
other than 80 are used, the port number is added to the URL.
For example http://www.someserver.com:8080.
Browsers Request: Once the TCP connection is established, the browser requests a
given document using its URL. An HTTP request types are get and posts data to a
server-side from handler that process the data. The most common HTTP request types
are get and post.
Get method:
 The Get request typically retrieves information from a server. Common uses of get
requests are to retrieve an HTML document or to fetch search results based on a
user-submitted search term.
 A get requests sends information to the server as part of the URL.

Post Method:
 A post request typically sends (or posts) data to a server. Common uses of post
requests are to end information to a server, such as authentication information or
data from a form that gathers user input.
 The post method sends from data as an HTTP message, not as part of the URL.
Server Response: The http (web server) process can automatically insert information
into the header of a response. Often this is the MIME (Multipurpose Internet Mail
Extension) type of the document which is based upon the file type. The server response
begins with a response code. Web servers can send many different codes to the browser.
The codes are grouped together logically with odes in the
 200-299 range indicating a successful request,

 300-399 indicating that a page may have moved ,
 400-499 showing client errors and
 500-599 showing server errors.
Closing the connection:
The client and server can both close the connection. This uses the standard TCP
approach. If another document is required a new connection must be established.
HTTP (HyperText Transfer Protocol)

UNIT -III
HTML (Hypertext Mark-up Language)
What is HTML? Explain its advantages and disadvantages.

HTML was developed by Tim Berners-Lee in 1990, HTML is short for Hyper Text
Markup Language. HTML is used to create electronic documents (called pages) that are
displayed on the World Wide Web. Each page contains a series of connections to other
pages called hyperlinks.
Advantages of HTML
 HTML is used to create WebPages.
 HTML used many tags to make a webpage. So it is a tag based language.
 The tags of HTML are surrounded by angular bracket.
 It can use wide ranges of colors, objects and layouts.
 Very useful for beginners in web designing field.
 First advantage it is widely used.
 Every browser supports HTML language.
 Easy to learn and use.
 It is by default in every window so you don't need to purchase extra software.
 To add special effects to the text which is to be presented on the net.
 To create hyperlinks between two or more documents.
 To add graphics to the webpage.
 To add images to the webpage.
 To create tables and present information in the tabular format.
 To create ordered, unordered and definition lists.
 To multiple documents in a single webpage using frames.
 To create data entry forms with different form elements.
 To add style sheets in a webpage
 To place audio, video and different multimedia objects in a webpage.
 To create image maps.
 We can also embed java script or VB scripts in a HTML document for data
validation.
Disadvantages of HTML
 It can create only static and plain pages so if we need dynamic pages then HTML
is not useful.
 Need to write lot of code for making simple webpage.
 Security features are not good in HTML.
 If we need to write long code for making a webpage then it produces some
complexity.

Explain Web Terminology

Web page: A document, typically written in HTML, which is almost always accessible via
HTTP, a protocol that transfers information from the web server to display in the user‟s
web browser.
Web site: A collection of web pages, images, videos, or other digital assets that is hosted
on one or several web servers, usually accessible via internet, cell phone or a LAN.
Web server: A computer that is only used to display websites and web pages.
Web browser: A web browser (commonly referred to as a browser) is a software
application for retrieving, presenting, and traversing information resources on the WWW
(World Wide Web). Common web browsers are Microsoft internet explorer, Google
chrome, Mozilla Firefox, and Apple safari etc...
URL: A URL (uniform resource locator) is a form of URI (uniform resource identifier) and
is a standardized naming convention for addressing documents accessible over the
internet or intranet. An example of a URL is http://www.yahoomail.com, which is the
URL for the yahoo mail website.
Homepage: The home page is the first web page that is displayed after starting a
web browser like Netscape's Navigator or Microsoft's Internet Explorer.
Html: HTML is a markup language for describing web documents (web pages).
 Html stands for hyper text markup language
 A markup language is a set of markup tags
 Html documents are described by html tags
 Each html tag describes different document content
Http: HTTP (Hypertext Transfer Protocol) is the set of rules for transferring files (text,
graphic images, sound, video, and other multimedia files) on the World Wide Web.
Hypertext: Hypertext is text which contains links to other texts. It is usually
differentiated from the normal text by a different color, by underlining, or by both.
Hypertext is text which is not constrained to be linear.
Hypermedia: hypermedia is not constrained to be text-based. It can include other
media, e.g., graphics, images, and especially the continuous media - sound and video.
The World Wide Web (www) is the best example of hypermedia applications.

What is HTML? Write Structure of an HTML document

Structure of HTML Document:
All HTML documents follow the same basic structure. HTML documents can be
prepared by using any ASCII supported text editor such as Notepad. HTML document
files must be saved with the extensions .html or .htm. HTML documents are also called
as “Web Pages”. Each HTML document usually contains different tags.
Every HTML document will have two sections such as Head Section and Body
Section.
Head: The head element contains title and meta data of a web document.
Body: The body element contains the information that you want to display on a web
page.
The basic form of an HTML document is as follows:

<HTML>
<HEAD>
<TITLE> Title of the HTML Document </TITLE>
</HEAD>
<BODY>
Actual Body of HTML Document
</BODY>
</HTML>

Header Section:
The header section of a HTML document contains control information used by the
browser and server. It includes information about the web page such as the Title, Script,
Style Sheets etc.
Body Section:
The body section of a HTML document contains the content that display on the
web page and tags that control how that content is formatted by the browser.
Example:
<HTML>
<HEAD>
<TITLE> This is My First Web Page </TITLE>
</HEAD>
<BODY>
Welcome to HTML Basics
</BODY>
</HTML>
Commenting in Web Pages:
A comment line in a HTML document is used to describe what the code does and
how it works. This plain text will not be considered by the web browsers while rendering
the web pages.
In HTML documents, comment tags start with „<!‟and end with „>‟ symbols. Each
comment can contain single line or multiple lines. If a comment contains multiple lines,
each line must start and end with „--„ symbols.
Example:
<! This is a comment --
-- which is continued in --
-- multiple lines of the code -- >
Comments can be placed in either the head section or body section of the
document. It is better to place the comment near to the feature that we want to describe.
Usually the developers place comments that give:
1. The name of the Application
2. Description of the purpose of the code in document

3. The name of the Author

4. The date of creation
5. The version number of the program
6. The copyright information
Example:
<HTML>
<HEAD>
<TITLE> This is an Example </TITLE>
<! -- Version Information --
-- File : Test.html --
-- Author : Mahesh MCA --
-- Date: 17-jun-2018 -- >
</HEAD>
<BODY>
This example is about how the comments are used in HTML Documents
</BODY>
</HTML>
Document Head:
The document head holds control information to be used by Web Browsers and
Servers. Usually the tag „<Title>‟ is used to display the title of the web page on title bar of
the window.
Example:
<HEAD>
<TITLE> Welcome To HTML </TITLE>
</HEAD>

2. Explain about HTML tags.

HTML Tags:
Any formatted text document is composed of a set of elements such as
paragraphs, heading and lists. A tag is a format name surrounded by angle brackets.
HTML tags are the instructions that are embedded directly into the text of a web page.
HTML tags instruct the browser how to format and organize the web page. Each tag
element must be enclosed within a pair of angular brackets (<, >).
Example: <HTML>, <H1>
HTML tags are classified into two types:
1. Singular Tags
2. Paired Tags
Singular Tags:
The tags that are having no closing or ending tag are called as „Singular Tags‟.
Example: <BR> , <HR>
Paired Tags:
The tags that have closing or ending tag are called as „Paired Tags‟.
Example: <HTML> </HTML>, <BODY> </BODY>
Note:
 Each tag must be enclosed within a pair of brackets
 Each tag may or may not have a closing tag
 Tags are not case sensitive
The general syntax of HTML tags:
<Tag Attribute=”Val” Attribute=”Val” . . . . >
Item to be formatted
</Tag>
Here „Tag‟ is the actual name of the tag, „Attribute‟ is the name of the attribute of
the tag and „Val‟ means the value of the attribute.
Example:
<Body Bgcolor="Red">
<Font Color="Blue" Size="20"> gminformatics </Font>

2. Discuss about the Document Body
The Body tag is a paired tag. This is the main part of every HTML document. It is used
to specify the actual contents such as text, heading, colors, tables, hyperlinks and so
on which is to be published on the web page. The body tag has number of useful
attributes, they are
1. BG Color
2. Background
3. Top Margin
4. Bottom Margin
5. Left Margin
6. Right Margin
7. Text
8. Link
9. Alink
10. Vlink
BG color:-
BG color means background color. This attribute is used to set the back ground color for a
HTML document its value can be specified by directly giving its color name or by specifying its
hexadecimal format (#RRGGBB)
Some of the named colors with their hexadecimal codes are as follows:
Colour Name Hexadecimal Code
BLACK #000000
WHITE #FFFFFF
RED #FF0000
GREEN #00FF00
BLUE #0000FF
YELLOW #FFFF00
SILVER #C0C0C0
GREY #F0F0F0
BACKGROUND:-
This attribute is used to set the graphical files having the extension “jpeg, jpg, gif “ as a
background to the webpage.
Text :-
This attribute is used to change the text color of the document name or a color specified in the
hexadecimal code i.e.., #RRGGBB
Hyperlink colors:- There are three attributes to specify the color of the hyperlink, they are ,

 Link
 Alink
 Vlink
Link:- It sets the color for hyperlink within the document that have not been visited.
This is unvisited hyperlink.
Alink:- This attribute is used to set the colors for the active link with in the document
Vlink:- This attribute is used to set color for hyperlink within the document that has
been already visited. It is a visited hyperlink attribute.
Margin attributes:-
The margin attributes are used to set Top, Bottom, Left and Right margins to the
webpage. These are classified in to four types
1. Top Margin
2. Left Margin
3. Bottom Margin
4. Right Margin
The values to these attributes should be in terms of pixels. The structure of body tag
with its attribute is:
Syntax: <Body [Bg =”Colourname”(or)”hexadecimal”]
[background =”path of a file”]
[text =”Colourname”(or)”hexadecimal”]
[link =”Colourname”(or)”hexadecimal”]
[Alink =”Colourname”(or)”hexadecimal”]
[Vlink =”Colourname”(or)”hexadecimal”]
[topmargin =”pixels”]
[left margin =”pixels”]
[right margin =”pixels”]
[bottom margin =”pixels”] >
Text
</BODY>
Ex:<BODY Bgcolor=”red” text=”blue” link=”pink” Alink =”white” Vlink =”black”>

WELCOME TO <A HREF=”GMINFORMATICS.JPEG” >GMINFORMATICS </A> e-

world <BR>
Kavali<BR>
NELLORE</BR>
<BODY>
In the Body tag we can use anther tags such as font tag image tag, anchor tag e.t.c.,
among all these tags font tag is mainly used in the body tag to Specify the text color,
size and type of to be used in the document.
There are several tags that are used to format the content of an HTML document. These
tags format or process the content of the document in various methods.
Discuss about HTML blocks.
Blocks:
HTML documents are structured as blocks of text each of which can be formatted
independently. There are two major blocks of text in HTML documents:
1. Paragraph
2. Heading
Almost all text and images in a document will be the part of either a heading or a
paragraph.
Paragraph:
The paragraph is used to break the text content into paragraphs. Most of the text
in a document is part of paragraph of information. Every paragraph has to be explicitly
tagged within the source of the document. To specify a block of text as a paragraph,
enclose it within the paragraph tag <P> and </P>. Each paragraph can be aligned to left
or right or center of the web page.
Structure of a Paragraph:
<P> Paragraph Content </P>
Example:
<P> This text is a part of the paragraph </P>
<P Align="Center"> gminformatics.com is a leading website </P>
<P Align="Left" Style="Color: Blue; Background-Color: Yellow">
This is My website </P>

Heading Tag:
Heading tag is used to place heading in the documents. Heading tag has 6
different levels where each level specifies a different size from H1 to H6.
Structure of Heading Tag:
<H1> Heading Tag </H1>
Example:
<H1 Align="Center"> Level 1 </H1>
Horizontal Ruler:
The tag „<HR>‟ is used to place a horizontal line across the web page. This
horizontal line can be aligned but default alignment is center alignment.
Structure of the tag:
<HR Align=”Value” Width=”Value” Size=”Value”>
Example:
<HR Align="Center" Width="75%" Size="4" NOSHADE>
Discuss about font tag and its attributes.

The <font> tag alone doesn‟t provide any real functionality, but with the help of a few
attributes, this tag is used to change the style, face, size and color of HTML text
elements. The size, color, and face attributes can be used all at once or individually, to
create font styles for any HTML element.
Basic Font Tag Attributes
1. SIZE: changes the size of text. The value must be between pixels 1 and 7. The size
can be given an absolute value or relative value . by default size is 1 pixel.
2. COLOR: changes the color of the text.
3. FACE: changes the font type of the text.
Syntax: <FONT SIZE= value COLOR = color FACE = “font – names”>
Example : <font size =2 face = Times new Roman” color = red> HELLO</font>

Example of Font size:

<html>
<head>
<body bgcolor = yellow>
<font size=”1?>Font size=”1?</font><br/>
<font size=”7?>Font size=”7?</font>
</body>
</html>
Example of Font face
<html>
<head>
<title> Font Face >/title>
</head>
<body>
<font face = “Times New Roman “ size =”5?> Times New Roman </font><br/>
<font face = “Verdana “ size =”5?> Verdana </font><br/>
<font face = “Comic sans MS “ size =”5?> Comic sans MS</font><br/>
<font face = “Calisto MT “ size =”5?> Calisto MT </font><br/>
<font face = “elephant “ size =”5?> elephant </font><br/>

3. Explain how Text can be formatted using HTML tags
HTML formatting: Generally web page is to be designed in an attractive manner. To

make a web page attractive we need to format it. Formatting means changing the
appearance. The following are the some of html formatting tags.
1. Heading Tags
2. Bold Tag
3. Italic
4. Under Line
5. Sub Script
6. Super Script
7. Small
8. Big
9. Break Tag
10. Horizontal Ruler
11. Center
12. Blink
13. Marquee
14. Code
15. Pre
16. Strike tag
17. Tele Typing Tag
18. Paragraph
Heading tags:
The HTML provides six levels of heading tags to display the headings on the webpage
there are
<H1>----</H1> ============= Heading Level One
<H2>----</H2> ============= Heading Level Two
<H3>----</H3> ============= Heading Level Three
<H4>----</H4>============= Heading Level Four
<H5>----</H5>============= Heading Level Five
<H6>----</H6>============= Heading Level Six
All the headings level tags are paired tags and these tags are having one attribute
“Align”. The possible values for this attribute are “left” or “right” or ”center”.

Eg:-
<Body>
<H1>GMINFORMATICS.COM</H1>
<h2align=”center”> GMINFORMATICS.COM</H2>
</Body>
In the above Eg, all the heading level tags form (H1-H6) display the heading with
different font sizes on the webpage. H1 is the larger and H6 is the smaller.
Bold : This tag is used to make the selected text as bold style.
Syntax: <Bold> text</Bold>
Eg: <B> gminformatics.com</B>
Italic : This tag is used to make the selected text as italic style.
Syntax: <I> text</I>
Eg: <I> gminformatics.com</I>
UnderLine : This tag is used to make the selected text as under lined style.
Syntax: <U> text</U>
Eg: <U> gminformatics.com</U>
Subscript : This tag is used to make the selected text as Subscript .
Syntax: <SUB> text</SUB>
Eg: H<SUB> 2</SUB>O
SuperScript : This tag is used to make the selected text as Superscript .
Syntax: <SUP> text</SUP>

Eg: (a+b)H<SUP> 2</SUP>O
Small : This tag is used to make the selected text as small style.
Syntax: <Small> text</Small>
Eg: <Small> MAHESH MCA</Small>
Big : This tag is used to make the selected text as Big style.
Syntax: <Big> text </Big>
Eg: <Big> mahesh mca </Big>
BR tag <BR>:-
BR tag means blank return tag. This tag is used to insert a line break . this is a singular
tag and it has no attribute
Eg:- <Body>
B.A<BR>
B.Com<BR>
B.Sc<BR>
</Body>
HR tag<HR>:-
This tag is used to draw a horizontal line on the webpage. It is a singular tag and it has
some attributes namely “align, width, size”.
Syntax:- <HR [align =”value”]
[width =”value”]
[size =”value”]
[no shade]>
In the above syntax the line width and line thickness set the basic appearance of the
line. The height and width of line can be specified in terms of pixels and as a percentage
of the browsers window‟s width. By default horizontal line has shade.
Eg:- <Body>

<HTML>
<HR>
<HR align=”center” width=50% size=5>
<HR align=”center” width=60% no shade>
</Body>
Center tag: This tag is used to make some content aligned to center.
Syntax: <CENER> TEXT <CENTER>
EX: <CENTER> gminformatics</CENTER>
Marquee tag:- This tag is used for moving or scrolling a text on the webpage. The text can be
moved in any direction i.e.., from left-right, right-left, up
Or down, down-up.the syntax of marquee tag is,
syntax:-
<marquee [direction=up/down/left/right”]
[Bg color=”color name/hexadecimal”]
[scroll delay=”value”]
[behaviour=”alternate/scrolling/slide]>
Text
</marquee>
In the above syntax, the direction of the marquee text. the value to this attribute are left, right,
up, down.
<marquee>[direction=”right” scrolldelay=20behaviour=alternate>
Gminformatics.com
</marquee>
Blink tag:
Blink tag is used to add blinking effect to the specified text. It is a paired tag the syntax of the
blink tag is,
Syntax:

<blink>text</blink>
Eg:
<blink> special offer</blink>
Strike tag: Blink tag is used to strike the specified line of text.
Syntax: <Strike>text</Strike>
Ex: <Strike>Rs.3000/-<Strike> 1500/- only.
Paragraph tag <P>:
The paragraph tag is used to break the text into paragraphs. That means it is used to insert a
block of text on a web page the paragraph tag is a paired tag but ending tag of the paragraph tag
is optional. It is also having some set of attributes
Syntax:
<P[align=”value”]
[style=”color”: value; background color: value;Font weight: value; fontsize: value]>
Block of text
[</P>]
In the above syntax, the closing tag is optional the style attribute has property: value. Pair
specifies appearance of the text .Each property: value pair is terminated by a semicolon (;).
<Body>
<P>
HTML is used to create document these are called webpage.
<P align=”center” style=”color: red, background, color: yellow: Fontweight: normal:

fontsize=20>
Tags define the structure and format of our webpage
</P>
</Body>
Code Tag: This tag is used to place programming code in web pages.
Syntax:
<code>

void main()
int a=10,b=20;
printf(“SUM =%d”,a,b);
Pre formatted tag: This tag is used to represent any preformatted text.
Syntax: <pre> pre formatted text</pre>
Ex:: <pre>
</pre>
Tele typing tag: This tag is used to represent typewriter text.
Syntax: <tt>text</tt>
<tt>Mahesh MCA</tt>
Escape Sequences:
The character escape sequences are used when we need to display characters that uses
as control sequences. All the character escape sequences start with an ampersand symbol (&)
and terminate with a semicolon symbol (;).
Example:
&©

Explain different Lists available in HTML and how they are used
Lists are one of the most effective way of structuring a website or its content. Lists
provide a very decent look to a web page when they are arranged in a systematic way.
A list is a collection of elements that belong to a particular category in HTML.
There are basically 3 types of lists available:
1. Unordered List (Basic Bulleted Lists)

2. Ordered List (Numbered Lists)
3. Definition Lists
Lists:
Both Unordered Lists and Ordered Lists are made up of set of list items. These
elements may be formatted using any other formatted tags. The basic structure of lists
is as follows:
<LI> Element </LI>
Example:
<LI> Apple </LI>
<LI> Banana </LI>
<LI> Coconut </LI>
Bulleted Lists / Unordered List:
An Unordered List is a list of elements without any sequence. The basic unordered
list has a bullet in front of each element in the list.
Structure:
<UL Type=”disc/square/circle” > . . . . . . </UL>
Examples:
1) <UL Type="circle">
<LI> Apple </LI>
<LI> Banana </LI>
<LI> Coconut </LI>
</UL>
2) <UL Type="disc">
<LI> Apple </LI>
<LI> Banana </LI>
<LI> Coconut </LI>
</UL>
3) <UL Type="square">
<LI> Apple </LI>

<LI> Banana </LI>

<LI> Coconut </LI>
</UL>
Output:
Numbered Lists / Ordered List:
A Numbered List is the list of elements with a certain order or sequence. Ordered
list contains a number in front of each element in the list. There are several number
schemes and they can be started from any value.
Structure:
<OL Type=”1/a/A/i/I” Start=”Value”> . . . . . </OL>
Examples:
1) <OL Type="1">
<LI> Apple </LI>
<LI> Banana </LI>
<LI> Coconut </LI>
</OL>
2) <OL Type="I">
<LI> Apple </LI>
<LI> Banana </LI>
<LI> Coconut </LI>
</OL>
3) <OL Type="A">
<LI> Apple </LI>
<LI> Banana </LI>
<LI> Coconut </LI>
</OL>
Output:

Definition List:
Definition Lists are different to both ordered list and unordered list. A definition list is a
list of elements in which every element is divided into two parts „Data Term‟ and „Data
Definition‟.
Data Term:
Data Term tag <DT> marks a data term whose definition will be provided as data
definition.
Data Definition:
Data Definition tag <DD> is used to provide explanation for previous data term tag
element.
Structure:
<DL>
<DT> Term </DT>
<DD> Definition </DD>
</DL>
Example:
<DL>
<DT> Internet </DT>
<DD> Internet is a huge network of Computers spread across the world
</DD>
<DT> Website </DT>

<DD> Website is a collection of web pages </DD>
</DL>
Output:
Explain how Colors are used to format a Web Page
Using colors in web pages makes them more attractive. Color is essential to the web
experience, it brings web pages alive. But these colors must be used carefully because
sometimes colors may frustrate the users to see them on the screen.
Example: Using Red Text on a Black Background

Colors can be used in number of places on a web page such as page background,
individual elements, links etc. Colors can be specified either by a color name or color
code.
Using Color Names:
There are some pre-defined color names such as Blue, Green, Red, Yellow, Gold,
Cyan, Black, White etc to color the web page.
Example:
<Html>
<Body BgColor="Blue" Text="Gold" Link="Cyan" Vlink="White" Link="Red">
Hi! these are the colors specified by names: <br>
<a href="Next.html"> Next Page </a>
</Body>
</Html>
Using Color Codes:
Color codes can be formed with the combination of 3 basic colors Red, Green, Blue.
These colors are called as RGB colors which can make any color by adding different
levels of intensities of each color. The intensity level of each color must be specified as
hexadecimal value in the range of 00 to 255 that is from 00 to FF. While specifying color
code each code must be preceded by „#‟ followed by a 6 digit code.
Example
#FF0000 - RED
#00FF00 - GREEN
#0000FF - BLUE
#000000 - BLACK
#FFFFFF - WHITE
Explain how Images are used to design a web page
Images are used to make a web page more attractive and give good web experience.
There are two constraints in placing images in a web page such as some browsers may
support limited number of formats and some users may set their browser not to
download images.

If the images are big in size, it takes more time to download that may frustrate the user.
There are many compression techniques to make images smaller in size such as:
1. JPG : Joint Photographic Experts Group
2. GIF : Graphics Interchange Format
3. TIF : Tagged Image File
4. PNG : Portable Network Graphics
An image can be used as background as well as foreground of a web page. To set

the background of a web page we use „Background‟ attribute of <BODY> tag.
Syntax: <Body Background=”URL”>
To display an inline image that is an image that appears in the body of the web page, we
use <IMG> tag. This tag places an image on a web page with different attributes.
Syntax:
SRC : Specifies the path of the picture file
Height : Sets the image size in vertical dimension
Width : Sets the image size in horizontal dimension
Alt : Specifies text to describe the image in words
Align : Aligns the image on the web page
Example:
<Html>
<Body Background=".\Animals\Dog.jpg">
</Body>
</Html>
<Html>
<Body>
<Img Src="Elephant.JPG" Height="200" Width="200" Align="Left" Alt="African
Elephant">
</Body>
</Html>
Image Hyperlinks:

The image hyperlinks create clickable images in the web pages. When we click on the
image, it will open the web page that is associated with the image hyperlink.
Syntax: < a href=”URL”> <Img Src=”URL”> </a>
Example:
<Html>
<Body>
<a href="Duck Details.html"> <Img Src="Duck.JPG"> </a>
</Body>
</Html>
Image Mapping:
An image map is a picture that has several areas where the user can click. Each
clickable area links to other web page.
Syntax: <Img Src=”URL” Usemap=”URL”>
The process of creating an image map includes two steps:

1. Creating Image:
Place an image on the web page that is going to be linked with a mapping code.
Syntax: <Img Src=”URL” Usemap=”#URL”>
The attribute „Usemap‟ specifies the name of the map.
Example:
<Img Src=”India.JPG” Usemap=”#AndhraPradesh”>
2. Create Map and Areas:

The tag <MAP> is used to define a client-side image map. An image map is an
image with clickable areas. The attribute „Name‟ of <MAP> tag creates a relationship
between the image and the map. A <MAP> tag contains several area elements that define
the clickable areas in the image map.
Syntax:
<Map Name=”#Map Name”>
List of area elements
</Map>

Area:
By using the tag <AREA>, we place the clickable areas on the image by specifying
the coordinates that give locations on the image in pixels.
The attribute „Shape‟ is used to specify the type of the shape such as „Rect‟, „Circle‟
and „Polygon‟.
Syntax:
<Area Shape=”Rect/Circle/Polygon/Default” Href=”URL” Alt=”Value”
Coords=”List of Coordinate values”>
Example:

UNIT -IV
Explain Tables and their characteristics in HTML

The table is one of the most useful constructs available in HTML. In HTML, a table is a
collection of rows and columns. We use tables to represent the data in the form of rows
and columns that give a professional look to the web page.
Table has two advantages such as structuring pieces of information and structuring the
whole web page. Usually tables are used to provide information in an organized way so
that information can be easily readable and understandable.
To represent data in the form of tables, we use the following tags:
1. Table Tag
2. Table Row Tag
3. Table Header Tag
4. Table Data Tag
1. Table Tag <TABLE>:
This tag is used to form a table that tells the browser how the appearance of the table looks like.
Everything between these two tags will be part of the table.
Structure:
The attributes of <TABLE> tag are used to set the appearance of the table in
various dimensions.
1. Align : Aligns the table to left, right or center of the web page
2. Border : Sets the size of the border in pixels
3. BgColor : Sets the background color of the table
4. BorderColor : Sets the border color of the table
5. CellPadding : Sets the white space between cell border and data item in pixels
6. CellSpacing : Sets the white space between two different cells in pixels
7. Width : Determines the size of the table in Horizontal dimension in the web page
7. Height : Determines the size of the table in Vertical dimension in the web page

Example:
2. Table Row Tag <TR>:
This tag is used to create a row in the table. Each row of the table must be placed
between the tags <TR> and </TR>. A row of a table can be aligned horizontally or vertically.
Structure:
< TR Align=”Left / Center / Right “ Valign=”Top / Center / Bottom”> . . . </TR>
Example:
<TR> <TH> Course ID </TH> <TH> Course Name </TH> </TR>
3. Table Header Tag <TH>:
This tag is used to form the heading of each column in the table. It gives the look for data inside
the cell as „<STRONG>‟.
Structure:
<TH Align=”Left / Center / Right” Valign=”Top / Center / Bottom” ColSpan=”N” RowSpan=”N”> . . . .< /TH>
Example:
<TR> <TH> Course ID </TH> <TH> Course Description </TH> </TR>
4. Table Data Tag <TD>:
This tag is used to place the data values under a column inside a cell. These tags form the
rows of a table. All the rows in a table must have same no.of cells.
Structure:
<TD Align=”Left / Center / Right” Valign=”Top / Center / Bottom” ColSpan=”N” RowSpan=”N”> . . . .< /TD>
Example:
<TR> <TD> C001 </TD> <TD> B.Sc (Comp. Sci.) </TD> </TR>

Example:
<HTML>
<BODY>
<Table Align="Center" Border="3" BorderColor="Blue">
<TR> <TH RowSpan="2"> Regd. No. </TH> <TH RowSpan="2"> Student Name
</TH> <TH ColSpan="3"> Marks in 3 Subjects </TH> </TR>

<TR> <TH> Maths </TH> <TH> Statistics </TH> <TH> Computers </TH> </TR>
<TR> <TD> 105053011 </TD> <TD> Malyadri </TD> <TD Align="Center"> 100
</TD> <TD Align="Center"> 100 </TD><TD Align="Center"> 95</TD> </TR>

<TR> <TD> 105053012</TD> <TD>Madhu</TD> <TD Align="Center"> 100
</TD><TD Align="Center"> 100 </TD><TD Align="Center"> 93</TD> </TR>

<TR> <TD> 10505313 </TD> <TD>Mahesh </TD> <TD Align="Center"> 100
</TD><TD Align="Center"> 100 </TD><TD Align="Center"> 96</TD> </TR>

</Table>
</BODY>
</HTML>
Advanced Table Elements:

These table elements are used to add extra settings to the table.
Caption Tag:
The tag <CAPTION> is used to set the title to the table.
Structure: <CAPTION> Table Heading </CAPTION>
Table Head Tag:
The tag <THEAD> is used to set the header of the table.

Structure: <THEAD> Table Header </THEAD>
Table Foot Tag:
The tag <TFOOT> is used to set the footer of the table.
Structure: <TFOOT> Table Footer </TFOOT>
Example:
<HTML>
<Body>
<Table Border="1" Align="Center">
<Caption> Course List and Descrptions </Caption>
<Thead> <TR> <TD ColSpan="2"> Sree Chaitanya Degree College </TD> </TR>
</Thead>
<TR> <TH> Course ID </TH> <TH> Course Description </TH> </TR>
<TR> <TD Align="Center"> C001 </TD> <TD> B.Sc </TD> </TR>
<TR> <TD Align="Center"> C002 </TD> <TD> B.Com </TD> </TR>
<TR> <TD Align="Center"> C003 </TD> <TD> B.A </TD> </TR>
<TFoot> <TR> <TD ColSpan="2"> Kavali </TD> </TR> </TFoot>
</Table>
</Body>
</HTML>
Output:

Discuss about Hyperlinks in HTML
Representing huge information in a single, lengthy web page is not an efficient way.
Because lengthy web pages take longer time to get download, which makes the user to
wait long time. If a web page takes long time to download then the user will go to some
other site for information.
To reduce the downloading time of a web page, the information must be distributed
among multiple web pages rather than in a single web page. These multiple web pages
should be linked to each other so that the user can navigate among web pages to gather
information quickly.
The links that are used to link web pages are called as “Hyperlinks”. Hyperlinks provide
the flexibility of navigation through various web pages rather than typing the URL of
each web page.
Hyperlink creation-anchor tag<A>:
The hyperlink is a link between two WebPages i.e.., linking one webpage in another webpage is
called as hyper linking. In HTML, the hyper linking is created by using anchor tag<A>.
Syntax:-
<a href =”URL”>text or image </A>
(URL: Address of the webpage to be linked)
In the above syntax, attribute iss used for specifying address of the webpage to be linked. This
address is also called as uniform resource locator (URL). The anchor tag can be used for the
following four types of hyperlinks. They are :-
1. Textual Hyperlinks
2. Graphical Hyperlinks
3. Mail To: Hyperlinks
4. Intra Document Hyper Link
Textual hyperlink:
A textual hyperlink is a hyperlink that creates a “clickable text”. When we click the textual
hyperlink, the webpage i.e.., linked to the textual hyperlink is opened. To create a textual
hyperlink we can use the anchor tag(<A>) as follows.
Eg:-
<body>
<A Href=”D:\GM\degree\student.HTML”> student </A>

<A Href=”D:\vs\degree\courses.HTML”> courses</A>
</body>
In the above example, the anchor tag creates two textual hyperlink
“student” & ”courses”. When we click on “courses” then it will display the file,
D:\GM\courses.HTML. By default the textual hyperlinks are displayed in blue color with
underline. After visiting the hyperlinks the link will be displayed in violet color.
Graphical hyper links:-
A graphical hyperlink is a hyper link that creates a “clickable image”. When we click on
the image, it will open the webpage i.e.., associated with it. To create graphical
hyperlinks, that anchor tag is used with an image a follows
Eg:-
<body>
<A Href=”d:\GM\degree\college.HTML”>
<img SRC= “c:\My documents\ college. Jpeg”>
<height=50% width=50% ALT=”check here>
</A>
</Body>
In the above example, when we clickable image “college. Jpeg”. Then it will open its
associated web page “GM\degree\college.HTML.
Mail to: hyperlink:

A mail to hyper link is a hyperlink which contains an e mail address of the webpage
developer as hyperlink reference. When we click on the “mail to: hyperlink”, it will open
a mail window by using that window, we can send any mail to the webpage sever. The
syntax of the anchor tag for creating mail to hyperlink as follows.
Syntax:- <A Href=”mail to: e-mail address”>text</A>
<A Href=”mail to: [email protected]”> contact me </A>
In the above example, the anchor tag creats mail to: hyperlink i.e.., “contact me”. when we click
“contact me” it will open a mail window to send messages to the web page developer
[email protected]. Generally the mail to: hyperlink are created at the of the web page.

Intra document hyperlinks:
It is also possible to create the links from one place to another place with the same document
this type of hyperlink are called as intra document hyper links
To create intro document links first we create or define labels to the different pages of the
document by using name attribute of the anchor tag after specifying the tables, we can link one
page to the other page with in the same document. By using these labels names as addresses in
the Href attribute of the anchor tag we can create intra document links.
EG:
<body>
<a name=”marks”>
<H3> About marks</H3>
-------------------------------
-------------------------------
-------------------------------
-------------------------------
<a name=”courses”>
<H3> courses</H3>
-------------------------------
-------------------------------
-------------------------------
<A Href=”# courses”>1. course details</A><BR>
<A Href=”#marks”>2. marks details</A>
</body>
Guidelines for creating hyperlink:
For creating hyperlink, we must follow some guidelines, Some important guidelines are ,
 the hyperlink text should not be underline

 the hypertext should be any user defined worked
 we should not use the reserve words(predefined) in the case of creating “mail to:” in the
address of the Href attribute and e.t.c..,

Example for Internal HyperLinks:

<Html>
<Body>
<Font Face="arial" Size="6">
This is the web page which tells about me in various sections using intra document links.
<br>
<a href="#Personal"> Personal Profile </a> <Br>
<a href="#Education"> Education Profile </a> <Br>
<a href="#Professional"> Professional Details </a> <Br>
<a href="#Family"> Family Details </a> <Br>
<br>
<a name="Personal">
<B> <U> Personal Profile: </B> </U> <br>
Name : G. Mahesh <br>
Date of Birth : 05-June-1986 <br>
Gender : Male <br>
Height : 154 CM <br>
Weight : 55 Kgs <br>
</a>
<br>
<a name="Education">
<B> <U> Educational Profile: </B> </U> <br>
Qualification : Master of Computer Applications<br>
Major : Computer Science <br>
University : Sri Venkateswara University <br>
Class : First Class <br>
</a>

<br>
<a name="Professional">
<B> <U> Professional Profile: </B> </U> <br>
Industry : Education <br>
Designation : Lecturer <br>
Organization : gminformatics <br>
Experience : 7 Years <br>
</a>
<br>
<a name="Family">
<B> <U> Family Details: </B> </U> <br>
Spouse Name : NO<br>
Children : No <br>
Child Name : NO<br>
</a>
<Body>
</Html>
Linking Sections of Different WebPages:
Sometimes the hyperlinks are used to link sections that are located in other web pages
also.
Structure:
<a href=”path#target”> Link Text </a>
Example:

Linking to Other Pages:

It is also possible to link a web page that is located in the same directory or some other directory
using Absolute Path or Relative Path.
Example:

Explain Frames in HTML with examples

Generally we display one web page in a document. We can also display multiple web pages at a
time. We use the feature called „Frames‟ to split a window into multiple parts where each part
displays an individual web page.
The tag „<FRAMESET>‟ is used to divide Browser‟s window into multiple individual and
independent scrollable areas. The frameset page contains a set of references to HTML files each
of which is displayed inside a separate frame.
Frameset:
A frame based page is actually made from a set of documents each displayed in its own frame.
All of the pages within a frameset are displayed inside the same browser window.
Syntax: <Frameset Cols=”%, %” Rows=“%, %”> . . . . </Frameset>
The tag „<Frameset>‟ determines how the screen will be divided between various frames.
COLS : Specifies the number of vertical frames
ROWS : Specifies the number of horizontal frames
Framesets can also be nested that is we can place a frameset inside another frameset.
Frame:
The tag „<FRAME>‟ is used to specify the content of the frame.
Syntax:
<FRAME Src=”URL” Name=”String” Scrolling=”Yes/No/Auto” FrameBorder=”0/1” >
SRC : Specifies path of the file
Name : Sets the name of the frame
Note: The HTML source file that contains Frameset does not allow <BODY> tag.
Example:
<Html>
<Frameset Cols="25%,75%">
<Frame Src="Images.html">
<Frameset Rows="50%, 50%">
<Frame Src="Nose.html">
<Frame Src="Tail.html">
</Frameset>
</Frameset>
</Html>

Explain HTML Forms and its important elements
Forms are used to create interactive web pages. An HTML form is a collection of several
fields such as text boxes, radio buttons, check boxes, password controls, buttons etc. All
these fields are used to accept information from the user. The collected information is
then transferred to a web server.
Each web page may contain one or more forms. The tag „<FORM>‟ is used to place
a form in a web page.
Syntax: <Form name=”Value” action=”URL” method=”post/get”>
Form Elements
</Form>
name :Specifies the name of the form
action :Specifies the name and location of CGI script that is used to process the data
method :Specifies the way how to send data that is collected from the user to the web
server. If the method is defined as GET, the data will be sent as part of the URL. If the
method is defined as POST, the data will be sent as part of the body of the message.
There are several data entry controls each having its own features.
INPUT Tag:
The tag „<INPUT>‟ is used to place an element in a form. This tag is used to place different
controls such as text box, password text box, check box, radio button, button etc.
Syntax:
<INPUT Type=”Text/Password/Checkbox/Radio/Submit/Reset/Button/Image”
Name=”Value” Value=”String” Size=”Value” Align=”Left/Right/Middle”>
Type: This attribute specifies what type of element we want to place on the form.
Text : Places a text box which allows the user to give textual input.
Password : It is almost similar to text box, but it does not display the content of the control
rather it displays only asterisk symbols in the place of any character.
Checkbox : Creates a simple checkbox that allows the user to check or uncheck type of
input.
Radio : Creates a radio button that allows the user to provide select or deselect type of input.
The set of options that are related to same field must be grouped by providing same name but
with different values.
Button : Places a button control that gives clickable actions.

Submit : Creates a button control that is used to send the data to the server according to
the action specified in the form tag.
Reset : Creates a button that is used to clear the contents of all the controls of the form.
Image : Places an image with specified URL.
Name :Specifies the name of the element that helps to identify the control among several
elements.
Value: Caption that is to be displayed along with the control.
SELECT Tag:
The tag „<SELECT>‟ is used to create a list box control that provides multiple options from
which user can select only one option.
OPTION Tag:
The tag „<OPTION>‟ is used to add an item to the select tag.
Syntax:
<SELECT Name=”Value”>
< OPTION > Item </ OPTION >
</SELECT>
TEXTAREA Tag:
The tag „<TEXTAREA>‟ is used to create a free format plain text area into which the user
can enter multiple rows of data.
Syntax:
<TEXTAREA Name=”Value” Rows=”N” Cols=”N”>
Example:
<Html>
<Body>
<Form Name="EmployeeDetails" method="GET " >
<Table>
<Tr> <TH Colspan="2"> Employee Registration Form </TH> </Tr>
<Tr> <TD Colspan=2 Align='Center'> <Input Type='Image' src='Mahesh.JPG' width=90
height=100 alt="Mahesh Photo"> </TD> </Tr>
<Tr>
<TD> Employee Code </TD><TD><Input Type="Text" Name="ECode"></TD>
</Tr>
<Tr>
<TD> Employee Name </TD> <TD> <Input Type="Text" Name="EName"> </TD>

</Tr>
<Tr>
<TD> Gender </TD> <TD> <Input Type="Radio" Name="Gender" checked> Male <Input
Type="Radio" Name="Gender"> Female </TD>
</Tr>
<Tr>
<TD> Date Of Birth </TD> <TD> <Select Name="Day">
<Option>1</Option><Option>2</Option><Option>3</Option><Option>5</Option></Select>
<Select Name="Month">
<Option>Jan</Option><Option>Feb</Option><Option>Mar</Option><Option>Jun</Option></Sele
ct>
<Select Name="Year">
<Option>1987</Option><Option>1984</Option><Option>1985</Option><Option>1986</Option></
Select>
</TD> </Tr>
<Tr>
<TD> Qualification </TD> <TD> <Select Name="Qualification">
<Option>M.Sc</Option><Option>MCA</Option><Option
Selected>M.Tech</Option><Option>B.Tech</Option></Select> <TD> </TD> </Tr>

<Tr> <TD> Address </TD> <TD> <TextArea Name="Address" Rows="4">
</TextArea></TD></Tr>
<Tr><TD> Salary </TD> <TD> <Input Type="Text" Name="Salary"> </TD>
</Tr>
<Tr>
<TD> Owning Vehicles </TD> <TD> <Input Type="Checkbox" Name="Bike">
Bike <Input Type="Checkbox" Name="Car"> Car
<Input Type="Checkbox" Name="NoVehicle"> No Vehicle </TD>

</Tr>
<Tr>
<TD Align="Center"> <Input Type="Submit" Value="Register"> </TD> <TD
Align="Center"> <Input Type="Reset" Value="Clear
Data"> </TD>
</Tr>
</Table>
</Form>
</Body>
</Html>


UNIT -V
1. What is Style Sheet? Explain how Styles are used to format the web page
In HTML it is possible to separate presentation and the document content. For this we use
„Styles‟. A style is simply a set of formatting instructions that can be applied to the content of a
web document.
There are 3 mechanisms for formatting the content of a web document.
They are,
1. In-line Styles
2. Embedded or Internal Styles
3. External Styles.
In-line Styles : The style can be defined within the basic HTML tag
Embedded or Internal Styles:
Styles can be defined in the <HEAD> section and applied to the whole document. By defining
the styles in head section , we can use these styles in this document only. But we cannot use
these styles in another document. In order to use a style in any document, we have to use
external styles. The following is an example for embedded style:
<Html>
<Head>
<Style>
h1 {
color : red;
font-family:"Monotype Corsiva";
}
</Style>
</Head>
<Body>
<H1> This is My Style </H1>
</Body>
</Html>
External Styles : The web designers can design all the styles that are going to be used in
designing a web page as separate external files. These external files are called as „Style Sheets‟

that can be included into our web documents. By including these styles into web documents as
external files, we can separate the presentation code from the document code.
Each external style sheet file must be saved with the extension .css. the designer can include
style sheets using the following syntax.
Syntax:
<Link rel=”stylesheet” href=”URL” type=”text/css” media=”screen”>
rel : Specifies the type of link
href : Specifies the path of the style sheet file
type : Specifies what type of document is being included
Example:
Including the above Style sheet into our document:

Cascading: Styles can be cascaded. That is the formats override previously defined
styles if any. It takes the last available style for formatting the content.
Example:
<Html>
<Body>
<H1> <Font Color="Green” Face="Cambria"> This is My Style </Font> </H1>
</Body>
</Html>
We can define styles under <HEAD> tag to format the content of the web page.
Syntax:
<Name of the Element> {
attribute : value;
attribute : value;
}
Example:
1)
<Html>
<Head>
<Style>
h1 {
color : red;
font-family:"Monotype Corsiva";

}
</Style>
</Head>
<Body>
<H1> This is My Style </H1>
</Body>
</Html>
2)
<Html>
<Head>
<Style>
h1 {
color : red;
font-family : "Comic Sans MS";
}
</Style>
</Head>
<Body>
<H1> <Font Color="Blue"> This is My Style </Font> </H1>
</Body>
</Html>
3)
<Html>
<Head>
<Style>
h1 {
color : red;
font-family:"Comic Sans MS";
text-align : center
}
</Style>
</Head>
<Body>
<H1> This is My Simple Style </H1>
</Body>
</Html>
4)
<Html>
<Head>
<Style>
h1 {
color : red;

font-family:"Cmabria";
text-align : center
}
</Style>
</Head>
<Body>
<H1> This is formatted Style </H1>
<P Style="Font-Face : Tahoma; Color:Blue">
This is example shows how inline styles are used along with the style sheets </P>
</Body></Html>
5)
<Html>
<Head>
<Style>
h1 {
color : red;
font-family: "Cambria";
text-align : center
}
h2 {
color : green;
font-family : "Book Antiqua";
}
.one {
color : Blue;
font-family : "Monotype Corsiva";
}
.two {
color : Cyan;
}
</Style>
</Head>
<Body>
<H1> These are My Styles </H1>
<H2> Each Paragraph with different Formats : </H2>
<P> This Paragraph is not applied any style </P>
<P Style="Color:Magenta"> This Paragraph is applied an Inline style </P>
<P class="one"> This paragraph is applied the style class one </P>
<P class="two"> This paragraph is applied the style class two </P>
</Body>
</Html>

Explain how we use our own Cascading Style sheets
Usually styles are cascaded that is the web designer can use many style sheets to design a web
page. The web designer can import as many style sheets he wants to import. The first one is
overridden by the second and second by third and so on.
Rules:
Each style rule has two parts such as selector and a set of declarations. The selector is used to
create a link between the rule and the HTML tag. The declaration has two parts like property and
value. Selectors can be placed into classes so that tag can be formatted in variety of ways.
Declaration must be separated using colons and terminated using semicolons.
Syntax:
Selector {
Property : Value;
Property : Value;
Example:
body {
background-color : Green;
h2 {
color : yellow;
font-family : "Book Antiqua";
Classes:
Classes are used to define tag styles with different styles and they can be used to design a
web page with different formats.
Syntax:
Selector.ClassName {
Property : Value;
Property : Value;

Property : Value;
Example:
h1.one {
color : red;
background-color : yellow;
fomt-family : "Monotype Corsiva";
h1.two {
color : #AA11FF;
background-color : cyan;
Once we define a set of classes with selectors, we can use those selectors as tags. We can
use the classes to format the web page. Each tag is extended by the attribute „ CLASS‟ to specify
the name of the class defined.
Syntax:
<Selector Class=ClassName>
Example:
<H1 class="one"> This Heading is Formatted using a class 'one' </H1>
<H1 class="two"> This Heading is Formatted using a class 'two' </H1>
Anonymous Classes:
We can use anonymous classes to format the content of a web page. Anonymous classes
are used when the designer wants to use some formats with various elements of the web
document.
Example:
<Html>

<Head>
<Style>
.one {
color : blue;
</Style>
</Head>
<Body>
<H1 class="one"> This is an Heading </H1>
This line is not formatted
<P class="one"> This paragraph is applied the anonymous class class 'One' </P>
</Body>
</Html>
Output:
Including Style Sheets:
The web designers can design all the styles that are going to be used in designing a web page as
separate external files. These external files are called as „Style Sheets‟ that can be included into
our web documents. By including these styles into web documents as external files, we can
separate the presentation code from the document code.
Each external style sheet file must be saved with the extension .css. the designer can include
style sheets using the following syntax.
Syntax:
<Link rel=”stylesheet” href=”URL” type=”text/css” media=”screen”>

rel : Specifies the type of link
href : Specifies the path of the style sheet file
type : Specifies what type of document is being included
Example:
Including the above Style sheet into our document:

Explain how various Properties and their Values used in designing Style Sheets
The text content of a web page can be formatted by altering various properties of text. While
using style sheets, we usually use many of these properties to format the text content.
Fonts:
Many operating systems have similar type of fonts. While specifying font names, it is always
better to use generic family, because some systems may not support all font types.
Syntax:
font-family : <Family Name> [<generic family>]

font-style : normal / italic / oblique
font-weight : normal / bold / bolder / lighter / 100 / 200 / 300
font-size : small / smaller / medium / large / larger / <value>
Backgrounds and Colors:
We can format the background and colors of a web page by using its properties. The
colors of any attribute can be changed. Background of the page or individual elements can have
their color set. An image can be used as the background of the web page.
Syntax:
color : Value
background-color : <Value>
background-image : URL
Example:

Web Document:
Output:

1. Headings
<html>
<head>
<title>headings</title>
</head>
<body>
<h1>heading one</h1>
<h2>heading two</h2>
<h3>heading three</h3>
<h4>heading four</h4>
<h5>heading five</h5>
<h6>heading six</h6>
<h7>heading seven</h7>
</body>
</html>
2. Text Formatting


<html>
<head>
<title>secoend one</title>
</head>
<body bgcolor="red">
<b>bold</b><br>
<i>italic</i><br>
<u>underline</u><br>
<s>strike</s><br>
X<sup>2</sup><br>
H<sub>2</sub><br>
<str>strong</str><br>
</body>
</html>
3. Ordered List

<html>
<head>
<title>third one</title>
</head>
<body>
<ol type="I">
<li>B.A
<li>B.COM
<li>B.Sc
<ol>
</body>
</html>

4. Unordered List

<html>
<head>
<title>fourth one</title>
</head>
<body bgcolor="yellow">
<font size="20"><ul type="square" size="20">
<center><li>Arts</li>
<li>Science</li>
<li>Commerce</li></center></font>
</body>
</html>
5. Insert an Image

<html>
<head>
<title>fifth one</title>
</head>
<center>
<img src="D:\Web\Mahesh.jpeg" width="300" height="500" border="5">
</center>
</body>
</html>
7. Create a Table

<html>
<head>
<title>seventh one</title>
</head>
<body bgcolor="pink">
<center><h3><font color="#121212" size="15"><u>Student Marks Details</u></h3></center>
<table border="5" align="center">
<tr>
<th colspan="3"align="center">Marks<th>
</tr>
<tr>
<th><i>Name</i></th>
<th><i>Roll no</i></th>
<th><i>Marks</i></th>
</tr>
<tr>
<th>Nagaraju</th>
<th>480</th>

<th>80</th>
</tr>
<tr>
<th>Sivaraju</th>
<th>111</th>
<th>59</th>
</tr>
<tr>
<th>Kumar</th>
<th>193</th>
<th>90</th>
</tr>
</table>
</body>
</html>
8. Text Hyper-linking

<html>
<head>
<title>eight one</title>
</head>
<body bgcolor="yellow"><center>
<a href="prg5.html"><font size="10">Photo</a></center>
<center>
<img src="D:\web\Mahesh.jpg" width="300" height="500" >
</center></img><br><br>
<center><a href="prg6.html"><font size="20">sample picture</a></font></body>
</html>
9. Image Hyper-Linking

<html>
<head>
<title>nine one</title>
</head>
<center>
<img src="D:\Web\Mahesh.jpg" width="300" height="200" >
</center></img><br><br>
<center><a href="6.html"><font size="20">My Photo </a></font></body>
</html>

10. College

<html>
<head>
<title>ten</title>
</head>
<font size="20"><ul type="square"size="20">
<center><li>Sree Chaitanya Degree College</li>
<li>III-B.Com Computer Applications</li>
<li>Wbe Technologies</li></center></font>
<p>Achieve your ambitions with our experience and expertise faculty.</p>
</ul>
</body>
</html>
11. Internal Hyper links

<html>
<head>
<title> Internal Links </title>
</head>
<body>
<h1><A id="home">
<A HREF="#c">C Language</A>
<hr><br>
<A HREF="#cpp">C++ Language</A>
<hr><br>
<A HREF="#java">Java Language</A>
<hr><br><br><br><br><br><br><br><br><br><br>
<pre>
<A id="c">
<h1>C Language</h1>
<h2>Contents</h2>
<h3>1.C Fundamentals</h3>
<h4>1.1 The Character Set
1.2 Identifiers and keywords
1.3 Data Types
1.4 Constants
1.5 Variables and Arrays
1.6 Declarations
1.7 Expressions
1.8 Statements
1.9 Symbolic Constants
</h4>

<A HREF="#home">Home</A>
</pre>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<A id="cpp">
<pre>
<h1>C++ language</h1>
<h2>Contents</h2>
<h3>Basics of Object Oriented Programming</h3>
<h4> 1.1 Introduction to Object Oriented Programming
1.2 Difference between Object Oriented Programming and POP
1.3 Basics concepts of OOP
1.4 Benifits of Object Oriented Programming
1.5 Applications of Object Oriented Programming
</h4>
</pre>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<A id="java">
<pre>
<h1>Java Language</h1>
<h3>Basics of Object Oriented Programming</h3>
<h4> 1.1 Introduction to Object Oriented Programming
1.2 Difference between Object Oriented Programming and POP
1.3 Basics concepts of OOP
1.4 Benifits of Object Oriented Programming
1.5 Applications of Object Oriented Programming
</h4>
</pre>
<br><br>
<br><br><br>
<br><br>
<br><br><br><br>
<br><br><br>
</body>
</html>
12. Lists
<html>
<head>
<title>Lists</title>
</head>
<body>
<h1>Illustrate three types of lists</h1>
<hr color=Black size=3>
<h2>1. Definition List</h2>
<dl>
<dt>Tag</dt>

<dd>-Instruction in Html</dd>
<dt>Attribute</dt>
<dd>-Property of a tag</dd>
</dl>
<h2>2. Order List</h2>
<ol>
<li>c</li>
<li>c++</li>
<li>Java</li>
</ol>
</body>
</html>
<h2>3. Un-Order List</h2>
<ul>
<li>MS-Office</li>
<li>Tally</li>
</ul>
</body>
</html>
13. Personal Information

<html>
<head>
<title>Personal Information</title>
</head>
<body topmargin=50>
<h1 align=center>Curriculum Viate</h1>
<hr color=black>
<table align=center border=5 width=70% style="color:000033;font-family:Tahoma;font-
size=12;font-weight:blod">
<tr><td>Name:<td colspan=3>G. Mahesh</tr>
<tr><td>Gender:<td colspan=3>Male</tr>
<tr><td>Date Of Birth:<td colspan=3>05-Jun-1986</tr>
<tr><td>Nationality:<td colspan=3>INDIAN</tr>
<tr><td>Religion:<td colspan=3>HINDU</tr>
<tr><td>Caste:<td colspan=3>BC</tr>
<tr><td rowspan=5>Address</tr>
<tr><td style="border-width=0" colspan=2>Street: Janathapeta</tr>
<tr><td style="border-width=0" colspan=2>Village/Town: Kavali</tr>
<tr><td style="border-width=0" colspan=2>Mandal: Kavali</tr>
<tr><td style="border-width=0" colspan=2>District: SPSR Nellore</tr>
<tr><td style="border-top=0;border-right=0;border-left=0" colspan=2> State: Andhra
Pradesh</tr>
<tr><td rowspan=6>Phone/Fax/E-Mail:</tr>
<tr><td style="border-width=0" colspan=2>Phone(Office): 99985001199</tr>
<tr><td style="border-width=0" colspan=2>Phone(Residence): 9985001199</tr>

<tr><td style="border-top=0;border-right=0;border-left=0" colspan=2> E-Mail:

[email protected]</tr>
<tr><td colspan=3>Education Qualification:</tr>
<tr bgcolor=gold align=center><td>Degree<td>University<td>Year</tr>
<tr><td>BSc<td>SV University<td>2004-2007</tr>
</table>
</body>
</html>
14. Alignment Using Tables

<html>
<head>
<title>Alignment using Tables</title>
</head>
<body>
<h1 align=center>Cool Pad Mobiles</h1>
<table border=1 align=center>
<tr><th>Special Equipment <th colspan=2 align=center>Specifications/Performance Data</tr>
<tr><td>Retractable protective armor<th>Engine Type<td>Jet Turbine</tr>
<tr><td>Weapons System<th>Thrust<td>150lbs@103%ROS</tr>
<tr><td>Instruments-Aircraft <th>Torque<td>1750 lbs/[email protected]%ROS</tr>
<tr><td rowspan=9 align=center><img src="laptop.jpg" width="150" height="100"></img><th>0 to
60MPH<td>3.7sec</tr>
<tr><th>Top Speed<td>Unknown</tr>
<tr><th>Brake Rating<td>Excellent</tr>
<tr><th>Wheel Base<td>141.0 in.</tr>
<tr><th>Length<td>260.7 in.</tr>
<tr><th>Width<td>94.4 in.</tr>
<tr><th>Wheels<td>Cate alloy,15 x 6.5</tr>
<tr><th>Fuel Requirement<td>high cost 97% Special</tr>
</table>
</body>
</html>
15. College Project


<html>
<head>
<title> Sree Chaitanya Degree College</title>
</head>
<frameset cols="20%,80%">
<frame src="left.html" name=left>
<frame src="right.html" name="right">
</frameset>
</head>
</html>


<html>
<body>
<h3><i>Courses Offered:</i></h3>
<h4><i><ul type="disc">
<li><a href="BSC.html" target="right">B.Sc Courses</a><br><br>
<li><a href="BCOM.html" target="right">B.Com Courses</a><br><br>
<li><a href="PG.html" target="right">P.G Courses</a>
</ul></i></h4>
</body>
</html>

<html>
<body>
<h1 style="font-family:Arial Black;"><center>SREE CHAITANYA DEGREE & PG
COLLEGE</center></h1>
<hr><hr>
<br><br><br><br><br><br><br><br>
<center>
<img src="laptop.jpg" width=300 height=300 border=1></img>
</center>
</body>
</html>

<html>
<body>
<h3><i>B.Com Courses:</i></h3>
<hr>
<li> B.Com Computer Science<br><br>
<li> B.Com General<br><br>
</ul>
<a href="right.html">Back to Home</a>
</i></h4>
</body>
</html>

<html>
<body>
<h3><i>B.Sc Courses:</i></h3>
<hr>
<li> B.Sc MSCS<br><br>
<li> B.Sc MECS<br><br>
<li> B.Sc MPCS<br><br>

<li> B.Sc Biotechnology

</ul>
</i></h4>
</body>
</html>

<html>
<body>
<h3><i>PG Courses:</i></h3>
<hr>
<li>M.Sc Computers<br><br>
<li>M.Com<br><br>
</ul>
</i></h4>
</body>
</html>
16. Website
<html>
<head><title>gminformatics.com</title>
</head>
<center>
<body>
<img src="D:/Web/logo.JPG" width="180px" height="75px" align="left"><br>
<br>
<hr>
<h3> Home | services | privacy </h3>
<hr>
<marquee> <h4> welcome To my Website, Hope You Like It</h4></marquee>
<img src="D:/Web/pic1.jpg" width="300px" height="180px">
<img src="D:/Web/pic7.jpg" width="300px" height="180px"><br>
Unit-I:
Basics of Computers :Definition of a Computer - Characteristics and Applications of Computers –
Block Diagram of a Digital Computer – Classification of Computers based on size and working –
Central Processing Unit – I/O Devices.
Unit-II:

Primary, Auxiliary and Cache Memory – Memory Devices. Software, Hardware, Firmware and
People ware – Definition and Types of Operating System – Functions of an Operating System – MS-
DOS – MS Windows – Desktop, Computer, Documents, Pictures, Music, Videos, Recycle Bin, Task
Bar – Control Pane.
<br>
<br>
<br>
<br>
<br>
<br>
<hr>
Copyright &copy 2018 All rights Reserved gminformatics.com
</body>
</center>
</html>
===============================================================

<html>
<head>
<title>Using Inline Style Sheets</title>
</head>
<body>
<p>This is simple text</p>
<p style="font-size:30pt;font-family:Script">This text is different</p>
<p style="font-size:40pt;color:#ff0000">This text is colored</p>
</body>
</html>
================================================================

<html>
<head>
<title>Example on CSS</title>
<link href="headcolor.css" rel="stylesheet">
</head>
<body>
<center>
<h4><u>Applying Different Colors for Headings</u></h4>
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
</center>

</body>
</html>
h1{
color:Blue;
}
h2{
color:Red;
}
h3{
color:Brown;
}
h4{
color:green;
}
h5{
color:Orange;
}
h6{
color:violet;
}

<html>
<head>
<link rel="stylesheet" type="text/css" href="External.css">
</head>
<body>
<h1 class="special">
<center>
This page is created using External Style Sheet
</center>
</h1>
<h2>
This line is aligned left and red colored
</h2>
<p>
Tha External Style Sheet is the compact representation of Cascading Style Sheets.
This paragraph is written in Monotype corsiva font size of 14 point.
</p>
<h3>This Line uses blue color arial font.

</h3>
</body>
</html>

h1

{
font-family:Arial
}
h2
{
font-family:Times New Roman;
color:red;
left:209x
}
h3
{
font-family:Arial;
color:blue;
}
p
{
font-size:14pt;
font-family:Monotype Corsiva
}
.special
{
color:green
}

V Sem

Uploaded by

Copyright:

Available Formats

V Sem

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

V Sem

Uploaded by

Copyright:

Available Formats

B.Com.

III YEAR – SEMESTER-V

PAPER-VI: WEB TECHNOLOGY

Introduction to Internet: Definition of Internet – History of Internet – Advantages & disadvantages of

Paper VI: WEB TECHNOLOGIES Prepared by Mahesh MCA

Inter connection of computers is known as network. Internet is used to share resources,

Computer Networks can be classified into the following types:

Wired Network Wireless Network

 Local area network(LAN)

Local Area Network (LAN)

Paper VI: WEB TECHNOLOGIES Prepared by Mahesh MCA

Metropolitan Area Network (MAN)

Wide Area Network (WAN)

Paper VI: WEB TECHNOLOGIES Prepared by Mahesh MCA

2. What is Internet? Explain its features.

Paper VI: WEB TECHNOLOGIES Prepared by Mahesh MCA

Paper VI: WEB TECHNOLOGIES Prepared by Mahesh MCA

Internet tools are:

Paper VI: WEB TECHNOLOGIES Prepared by Mahesh MCA

5. Explain how internet works

Paper VI: WEB TECHNOLOGIES Prepared by Mahesh MCA

The internet is a packet – switch network. The emphasis is on exchanging packets of

6. Explain World-Wide Web (WWW)

Paper VI: WEB TECHNOLOGIES Prepared by Mahesh MCA

What is web browser? Explain different types of Web Browsers

Paper VI: WEB TECHNOLOGIES Prepared by Mahesh MCA

What is World Wide Web?

Web is a collection of electronic resources. A recent but revolutionary development on

World Wide Web: (also called as W3 or simply as WEB)

Paper VI: WEB TECHNOLOGIES Prepared by Mahesh MCA

Paper VI: WEB TECHNOLOGIES Prepared by Mahesh MCA

 Junk: Junk e-mail is an undesirable or inappropriate e-mail also called as Spam.

Paper VI: WEB TECHNOLOGIES Prepared by Mahesh MCA

Paper VI: WEB TECHNOLOGIES Prepared by Mahesh MCA

4. Describe in detail E-mail Inner Working

Paper VI: WEB TECHNOLOGIES Prepared by Mahesh MCA

5. Explain briefly about the message components?

 Date – it indicates on which date the Email was sent.

Header From: V.S.University <[email protected]> Tue Aug 28 2014

Date : Tue Aug 28 2018 12:00 IST

Subject: regarding to examination time table

Greeting Dear sir,

Control of the Examinations,

Paper VI: WEB TECHNOLOGIES Prepared by Mahesh MCA

Greetings: How to address the recipients is mentioned in this section

6. Discuss about message composition.

Send Spell Check Cancel

Paper VI: WEB TECHNOLOGIES Prepared by Mahesh MCA

 Open Web Browser (Ex: Internet Explorer, Google Chrome, Firefox).

Paper VI: WEB TECHNOLOGIES Prepared by Mahesh MCA

7. Explain the mailer features (features of e-mail)

A mailer is an application program used to compose, manipulate and send email.

Compose, File and Replay:

A compose command typically provides the following features-

 New – compose a message

A file command has the following functionality –

 Save – save the current message into a file

A replay command usually consists of the following items –

Paper VI: WEB TECHNOLOGIES Prepared by Mahesh MCA