ITIM Muskan

IT InfrastructureAManagement
Practical File
On
Session: 2021-2023
Submitted to: Submitted by:

Miss. Chanchal Sunidhi
Assistant Professor Roll No. 21024
K.A.I.M., Charkhi Dadri Uni. R.No. - …………..
MBA 2nd Sem.
Kedarnath Aggarwal Institute of Management, Ch. Dadri
Affiliated to M.D. University, Rohtak
1
Contents
S. No. Topic
1. HTML
2. Usability of HTML
3. Advantages and Disadvantages of HTML
4. HTML Tags
5. Creating an HTM document
6. Viewing HTML document in a browser
7. HTML Styles
8. HTML Tables
9. Lists in HTML
10. Inserting Image
11. Linking
12. Internet
13. Home page of important websites
2
Introduction:
There are a number of services on the Internet that enables computer to share and access
information. Among them, the most popular one is the World Wide Web. The reason why it has
become so popular so fast is because it provides multimedia information and interaction. Images,
text, animation, movies, games and many other information could be shared between computers.
Each web page has its own Internet address called URL (Uniform Resource Locator) so that
Internet users could access it using standard browser such as Netscape Navigator and Internet
Explorer. Web pages are designed using HTML.
HTML
HyperText Markup Language (HTML) is the main markup language for displaying web
pages and other information that can be displayed in a web browser.
HTML is written in the form of HTML elements consisting of tags enclosed in angle brackets
(like <html>), within the web page content. HTML tags most commonly come in pairs like <h1>
and </h1>. The first tag in a pair is the start tag, the second tag is the end tag (they are also
called opening tags and closing tags). In between these tags web designers can add text, tags,
comments and other types of text-based content.
The purpose of a web browser is to read HTML documents and compose them into visible or
audible web pages. The browser does not display the HTML tags, but uses the tags to interpret
the content of the page.
HTML elements form the building blocks of all websites. HTML allows images and objects to
be embedded and can be used to create interactive forms. It provides a means to create
structured documents by denoting structural semantics for text such as headings, paragraphs,
lists, links, quotes and other items.
3
HyperText Markup Language (HTML) is a format that allows to define the different elements
of a web page that could be viewed by a browser (e.g.: Internet Explorer, Netscape, Opera
etc…).
HTML defines:
 Text
 Text presentation.
 Pictures place and size
 The positioning of animations and sounds.
 Any place of a static or dynamic elements on the page managed by the
browser
 Hypertext links
Thus HTML is the language use to design any things that can be view on the WEB.
Usability of HTML
4
To define web pages.
Web pages are always designed with this language, that browser interpret the source code, goes
to search external elements (pictures, sounds…) and reconstitute the complete web page that it
presents Surfer on their screens.
There are successive versions of this language, allowing to define more finely the page-setting.
Define web page on a local computer.
It’s possible to define local web pages on a stand alone machine and read them thanks to
Browser without using any internet connection. It’s possible to design them and work on it into a
LAN too.
Advantages and Disadvantages of HTML
5
Advantages:
 Simple and easy to understand. Easy to learn & code even for novice programmers.
 Easy to use. So simple that they can be constructed using an ASCII files editors.
Therefore, authoring HTML documents is universally enabled.
 Loose syntax (although, being too flexible will not comply with standards)
 Supported on almost every browser, if not all browsers.
 Widely used; established on almost every website, if not all websites.
 Free - It is by default in every window so you don't need to purchase extra software.
 The language directly supports manual document-to-document navigation via hyperlinks.
Disadvantages:
 Insufficient tags for some advance HTML coder.

 Tags recognized by one browser may not be recognized by others.
 Need to write lot of code for making simple webpage.
 If we need to write long code for making a webpage then it produces some complexity.
 It cannot produce dynamic output alone, since it is a static language, it can create only
static and plain pages so if we need dynamic pages then HTML is not useful.
 Sometimes, the structuring of HTML documents is hard to grasp.
 Security features offered by HTML are limited
 Its distributed structure (external links) makes storage difficult; it’s easy to loose or forget
an element without realizing it.
6
HTML is a language for describing web pages
 HTML stands for Hyper Text Markup Language

 HTML is a markup language
 A markup language is a set of markup tags
 The tags describes document content
 HTML documents contain HTML tags and plain text
 HTML documents are also called web pages
HTML Tags
HTML markup tags are usually called HTML tags
1. HTML tags are keywords (tag names) surrounded by angle brackets like <html>
Some common tags used in HTML are:
 <HTML> - The tag that encloses all HTML content.

 <HEAD> - Contains information about the document including its title, script used, style
definition & document description.
 <TITLE> - Tag for the browser title
 <BODY> - This tag encloses all the tags, attributes & information that we want a visitor
browser display.
 <H1> to <H6> - Headers - to display headings
 <OL>, <UL>, <LI> - to display lists (Ordered and unordered)
 <BR> - to give break & start a new line
 <B>, <I>, <U> - text formatting - to display text in bold, italics, underlined.
 <IMG> - to display images etc...
2. HTML tags normally come in pairs like <b> and </b>

3. The first tag in a pair is the start tag, the second tag is the end tag
4. The end tag is written like the start tag, with a forward slash before the tag name
5. Start and end tags are also called opening tags and closing tags
<tagname>content</tagname>
7
Every HTML document should follow this general form:
<html>
<head>
<title>
Title of page is written here
</title>
</head>
<body>
The HTML tags, attributes, and information that define our page go here
</body>
</html>
HTML Elements
"HTML tags" and "HTML elements" are often used to describe the same thing.
But strictly speaking, an HTML element is everything between the start tag and the end tag,
including the tags:
HTML Element:
<p> This is a paragraph. </p>
8
Creating an HTML Document
To create an HTML document using a text processor Notepad, follow these steps:
1. Start Programs Accessories Notepad
Click here to
open
9
2. Now the Notepad Window appears. Type the HTML code here
<html>
<head>
<title> Title of page is written here </title>
</head>
<body>
Document body goes here
</body>
Hi! I am
</html>
Notepad
window
Giving Title to the document
Type the HTML code in Notepad window:
<html>
<head>
<title> Computer Networks and Internet </title>
</head>
</html>
10
3. To save this code, click at File Save command. Then in the Save dialog box, after
selecting the desired location, given the desired file name along with extension .html and then
click at Save button.
Click here
to save file
Type the file name

here along with
extension .html
Then click
here to save
11
Viewing HTML Document in a Browser
Click here
(Browser) to
view web page
HTML Document in a Browser:
Title of the HTML document
12
Document with Title & Body
Type the HTML codes in Notepad window:<html>
<head>
<title> Kedarnath Aggarwal Institute of Management </title>
</head>
<body>
Kedarnath Aggarwal Institute of Management (KAIM), Charkhidadri was established in 1995.

This is one of the first self financed institutes to be estabilished in Haryana. KAIM is located at
peaceful, pollution free & healthy environment of Charkhi Dadri, which is a fast developing city
on Delhi-Narnaul National Highway and well connected by Road & Rail transport. The Campus
is spread over 100 acres of land acquired by DES and the campus is well developed with all
ultra-modern facilities required for a professional Institute.
</body>
</html>
To save this code, click at File Save command. Then in the Save dialog box, after
selecting the desired location, given the desired file name along with extension .html and then
click at Save button.
Click here
to save file
13
Type the file name
here along with
extension .html
Then click
here to save
Result:
Title of the HTML document
Informati
on that
define
our page
14
Headings in HTML (H1….. H6 Tags)
Type the HTML codes in Notepad window:
<html>
<body>
<h1>This is heading 1</h1>
</body> </html>
Result:
15
Paragraph
<html>
<head>
<title>
Kedarnath Aggarwal Institute of Management
</title>
</head>
<body>
<h1> KAIM FAMILY </h1>
<p> Kedarnath Aggarwal Institute of Management (KAIM),Charkhidadri was established in

1995. This is one of the first self financed institutes to be estabilished in Haryana. KAIM is
located at peaceful, pollution free & healthy environment of Charkhi Dadri, which is a fast
developing city on Delhi-Narnaul National Highway and well connected by Road & Rail
transport. The Campus is spread over 100 acres of land acquired by DES and the campus is well
developed with all ultra-modern facilities required for a professional Institute.
<h1> courses provides
</h1>
<p> BBA<br>MBA
<h1> Facilities </h1>
<p>Library<br>Canteen<br>Transportation<br>Hostels<br>Sports<br>Bank/ATM
</body>
</html>
16
Result:
Changing Paragraph Alignment – ALIGN attribute
<html>
<head>
<title> Capital Market </title>
</head>
<body>
<h1 align=right>
Mobilization of Savings : Capital market is an important source for mobilizing idle savings from
the economy. It mobilizes funds from people for further investments in the productive channels
17
of an economy. In that sense it activate the ideal monetary resources and puts them in proper
investments. </h1>
<h1 align=center>Capital Formation : Capital market helps in capital formation. Capital

formation is net addition to the existing stock of capital in the economy. Through mobilization of
ideal resources it generates savings; the mobilized savings are made available to various
segments such as agriculture, industry, etc. This helps in increasing capital formation.</h1>
<h1 align=left>Continuous Availability of Funds : Capital market is place where the investment
avenue is continuously available for long term investment. This is a liquid market as it makes
fund available on continues basis. Both buyers and seller can easily buy and sell securities as
they are continuously available. Basically capital market transactions are related to the stock
exchanges. Thus marketability in the capital market becomes easy.</h1>
</body>
</html>
Result:
18
HTML Styles
1. Text color, styles & Background color
<html>
<body style="background-color:PowderBlue;">
<h1>Look! Styles and colors</h1>
<p style="font-family:verdana;color:red;">
This text is in Verdana and red</p>
<p style="font-family:times;color:green;">
This text is in Times and green</p>
</body>
</html>
Result:
19
2. Bold, Italic, underline & strike
<html>
<head>
<title> Capital Market </title>
</head>
<body>
<b>Mobilization of Savings </b><br>
<i>Capital Formation </i><br>
<u>Continuous Availability of Funds </u><br>
<s>Phyical delivery of shares</s>
</body>
</html>
Result:
20
HTML Tables
1. Simple tables
<html>
<body>
<p>
Each table starts with a table tag.
Each table row starts with a tr tag.
Each table data starts with a td tag.
</p>
<h4>One column:</h4>
<table border="1">
<tr>
<td>100</td>
</tr>
</table>
<h4>One row and three columns:</h4>

<table border="1">
<tr>
<td>100</td>
<td>200</td>
<td>300</td>
</tr>
</table>
<h4>Two rows and three columns:</h4>

<table border="1">
21
<tr>
<td>100</td>
<td>200</td>
<td>300</td>
</tr>
<tr>
<td>400</td>
<td>500</td>
<td>600</td>
</tr>
</table>
</body>
</html>
Result:
22
2.Tables without borders
<html>
<body>
<h4>This table has no borders:</h4>

<table>
<tr>
<td>100</td>
<td>200</td>
<td>300</td>
</tr>
<tr>
<td>400</td>
<td>500</td>
<td>600</td>
</tr>
</table>
<h4>And this table has no borders:</h4>

<table border="0">
<tr>
<td>100</td>
<td>200</td>
<td>300</td>
</tr>
<tr>
<td>400</td>
<td>500</td>
<td>600</td>
</tr>
23
</table>
</body>
</html>
Result:
Superscript
<html>
<head>
<title>MATHEMATICAL FORMULAE</title>
</head>
<body>
<h1>Algebra</h1>
1. (a + b)<sup>2</sup> = a<sup>2</sup> + 2ab + b<sup>2</sup><br>
2. (a − b)<sup>2</sup> = a<sup>2</sup> − 2ab + b<sup>2</sup>
</body>
</html>
24
Result:
Subscript
<html>
<head>
<title>CHEMISTRY EQUATIONS</title>
</head>
<body>
<h1>Balanced Chemical Equation</h1>
1. 2H<sub>2</sub> + O<sub>2</sub> = 2H<sub>2</sub>O
</body></html>
Result:
25
Lists in HTML
1. An unordered list
<html>
<body>
<h4>An Unordered List:</h4>

<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
</body>
</html>
Result:
2.An ordered list

<html>
<body>
<h4>An Ordered List:</h4>
<ol>
26
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
</body>
</html>
Result:
3.Different types of ordered lists

<html>
<body>
<h4>Numbered list:</h4>
<ol>
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ol>
<h4>Letters list:</h4>
<ol type="A">
<li>Apples</li>
27
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ol>
<h4>Lowercase letters list:</h4>

<ol type="a">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ol>
<h4>Roman numbers list:</h4>

<ol type="I">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ol>
<h4>Lowercase Roman numbers list:</h4>

<ol type="i">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ol>
</body>
</html>
28
Result:
29
4.Different types of unordered Lists
<html>
<body>
<h4>Disc bullets list:</h4>

<ul style="list-style-type:disc">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ul>
<h4>Circle bullets list:</h4>

<ul style="list-style-type:circle">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ul>
<h4>Square bullets list:</h4>

<ul style="list-style-type:square">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ul>
</body>
</html>
30
Result:
5. Nested list
<html>
<body>
<h4>A nested List:</h4>
31
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea</li>
</ul>
</li>
<li>Milk</li>
</ul>
</body>
</html>
Result:
32
Inserting Images
The src attribute – to specify image source

The src attribute for the <img> tag is required; its value is the image file’s URL.
The height and width attributes – A more efficient way to specify an image’s dimensions is with
the height and width attributes of <img>.
<html>
<body>
<p style="font-family:times;">
ZooZoos are advertisement characters promoted by Vodafone since the Indian Premier League
Season 2 (IPL).ZooZoos are white creatures with ballooned bodies and egg heads who are used
to promote various value added services of Vodafone. The ads were created by Ogilvy &
Mather, the agency handling Vodafone advertisements.
</p>
<img src="zoozoo.jpg" width="200" height="200">
<p style="font-family:times;">
The ads were shot by Bangalore based Nirvana Films in Cape Town, South Africa.
</p>
<img src="zoozooatwork.jpg" width="280" height="200">
</body>
</html>
33
Result:
34
Linking
The chief power of HTML comes from its ability to link text and/or an image to another
document or section of a document. A browser highlights the identified text or image with color
and/or underlines to indicate that it is a hypertext link (often shortened to hyperlink or just link).
1. Link with Text:
<html>
<head>
<title> Linking </title>
</head>
<body>
A computer is a general purpose device that can be programmed to carry out a finite set of
arithmetic or logical operations. Conventionally, a computer consists of at least one processing
element, typically a <a href="Central processing unit.docx">central processing unit (CPU) </a>
and some form of memory.
</body>
</html>
Result:
This is a link.
Upon clicking
here link
opens.
35
Choose what
you want,
either open or
save
Link opens as below:
36
2.Link with Image
<html>
<head>
<title> Image Linking </title>
</head>
<body>
Google Search, a web search engine, is the company's most popular service. Google indexes
billions of web pages, so that users can search for the information they desire, through the use of
keywords and operators.
<a href="http://www.google.com/"> <img src="google.jpg"> </a>
</body>
</html>
Result:
This picture is a
link. Upon clicking
here link opens.
37
Link opens as below:
38
Internet
What is the Internet?
The Internet is a global wide area network that connects computer systems across the world. It
includes several high-bandwidth data lines that comprise the Internet "backbone." These lines are
connected to major Internet hubs that distribute data to other locations, such as web servers and
ISPs.
In order to connect to the Internet, we must have access to an Internet service provider (ISP),
which acts the middleman. Most ISPs offer broadband Internet access via a cable, DSL, or fiber
connection. When we connect to the Internet using a public Wi-Fi signal, the Wi-Fi router is still
connected to an ISP that provides Internet access. Even cellular data towers must connect to an
Internet service provider to provide connected devices with access to the Internet.
The Internet provides different online services. Some examples include:
 Web – a collection of billions of web pages that you can view with a web browser.
 Email – the most common method of sending and receiving messages online.
 Social media – websites and apps that allow people to share comments, photos, and
videos.
 Online gaming – games that allow people to play with and against each other over the
Internet.
 Software updates – operating system and application updates can typically downloaded
from the Internet.
In the early days of the Internet, most people connected to the Internet using a home computer
and a dial-up modem. DSL and cable modems eventually provided users with "always-on"
connections. Now mobile devices, such as tablets and smartphones, make it possible for people
to be connected to the Internet at all times. The Internet of Things has turned common appliances
and home systems into "smart" devices that can be monitored and controlled over the Internet.
39
What are the Advantages of the Internet?
 Communication:
The main advantage of the internet is the faster communication than any other device. It’s an
instant process. Communication in the form of video calls, emails, etc. is possible using the
internet. Thus, there is no specific region that can be accessed. It is accessible all over the world.
Hence, tackling global issues has become easier with thought leaders from different parts of the
world coming together to solve them.
 Information:
The internet is the source of knowledge. One can get information about almost everything. It is
easily accessed with sources giving you the option of additional knowledge on the subject as
well. Information like educational related, government laws, market sales, stocks and shares,
new creations, etc. are gathered from a single place.
 Learning:
The internet has now become a part of education. Education like homeschooling is easily carried
out using the internet. Teachers can upload their teaching videos on the internet and are accessed
by people across the world which is helpful for all students. The marks are also released on the
internet since; releasing mark for the whole institution in notice boards will create chaos.
 Entertainment:
The internet is now the most popular form of entertainment. Movies, songs, videos, games, etc.
are available on many websites for free. Social networking is also possible using the internet.
Hence, there are tons of entertainments that are available online with easy accessibility for
everyone.
 Social network:
Social networking is the sharing of information with people across the world. Apart from being
an entertainment website, it has many uses. Any job vacancy, emergency news, ideas, etc. can be
shared on the website and the information gets passed on quickly to a wide area. Also, social
networking websites are used to easy communications. For example, Facebook, Twitter, and
Instagram are some popular networking sites.
40
Disadvantages of Internet
 Spam:
The unnecessary emails, advertisements, etc. sometimes are said to be spam because they have
the ability to slow down the system and make the users to face lots of problems. Spam emails
create confusion as important emails are also stored along with them.
 Virus attacks:
The malware or virus threats are so deadly that affects the system to a greater extend. It
immediately deletes all important files and finally, the system ends up crashing. The virus attack
is possible in three ways. One it attacks selected files. Two, it harms the executable boot files and
most dangerous of all is the macro virus which has the ability to replicate and expand to all parts
of files.
 Virtual world:
The people using the internet often will forget the difference between the virtual and real worlds.
This causes people to get depressed quickly and it leads to social isolation and obesity problems.
Obesity is due to the lack of any physical exercise. So it is better to play outdoor rather on the
internet
41
Home Pages Of Important Websites
Home Page of MDU
Home Page of KAIM
42
Home page of Amazon
Home Page of Flipkart
Home Page of Ministry Of Commerce

43
Home page of RBI
44

ITIM Muskan

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

ITIM Muskan

Uploaded by

Copyright:

Available Formats

IT InfrastructureAManagement

Submitted to: Submitted by:

Affiliated to M.D. University, Rohtak

Define web page on a local computer.

Advantages and Disadvantages of HTML

 Insufficient tags for some advance HTML coder.

 HTML stands for Hyper Text Markup Language

HTML markup tags are usually called HTML tags

Some common tags used in HTML are:

 <HTML> - The tag that encloses all HTML content.

2. HTML tags normally come in pairs like <b> and </b>

Title of page is written here

<p> This is a paragraph. </p>

1. Start Programs Accessories Notepad

<title> Title of page is written here </title>

Document body goes here

Giving Title to the document

Type the HTML code in Notepad window:

<title> Computer Networks and Internet </title>

Type the file name

HTML Document in a Browser:

Title of the HTML document

Type the HTML codes in Notepad window:<html>

<title> Kedarnath Aggarwal Institute of Management </title>

Kedarnath Aggarwal Institute of Management (KAIM), Charkhidadri was established in 1995.

Type the HTML codes in Notepad window:

<h1>This is heading 1</h1>

<h2>This is heading 2</h2>

<h3>This is heading 3</h3>

<h4>This is heading 4</h4>

<h5>This is heading 5</h5>

<h6>This is heading 6</h6>

Type the HTML codes in Notepad window:

Kedarnath Aggarwal Institute of Management

<h1> KAIM FAMILY </h1>

<p> Kedarnath Aggarwal Institute of Management (KAIM),Charkhidadri was established in

<h1> courses provides

<h1> Facilities </h1>

Changing Paragraph Alignment – ALIGN attribute

Type the HTML codes in Notepad window:

<title> Capital Market </title>

<h1 align=center>Capital Formation : Capital market helps in capital formation. Capital

1. Text color, styles & Background color

Type the HTML codes in Notepad window:

<h1>Look! Styles and colors</h1>

This text is in Verdana and red</p>

This text is in Times and green</p>

Type the HTML codes in Notepad window:

<title> Capital Market </title>

<b>Mobilization of Savings </b><br>

<i>Capital Formation </i><br>

<u>Continuous Availability of Funds </u><br>

<s>Phyical delivery of shares</s>

Type the HTML codes in Notepad window:

<h4>One row and three columns:</h4>

<h4>Two rows and three columns:</h4>

<h4>This table has no borders:</h4>

<h4>And this table has no borders:</h4>

Type the HTML codes in Notepad window:

1. (a + b)<sup>2</sup> = a<sup>2</sup> + 2ab + b<sup>2</sup><br>

2. (a − b)<sup>2</sup> = a<sup>2</sup> − 2ab + b<sup>2</sup>

Type the HTML codes in Notepad window:

<h1>Balanced Chemical Equation</h1>