Practical File Internet Fundamentals Lab: BCA-DS-107

IF LAB(BCA-DS-107)
Practical File
Internet Fundamentals Lab
BCA-DS-107
B.S. Anangpuria Institute of Technology and Management
(Approved by AICTE & Affiliated to J. C. Bose University of Science & Technology, YMCA, Faridabad)
BallabhgarhSohna Road, Faridabad
Submitted To : Submitted By :
Mr. Shravan Kumar Name: Nikhil Satija
Asst. Prof. (BCA Deptt.) 19/BCADS--11
B.S.A.I.T.M. B. C. A. 1st Sem
Nikhil Satija 19/BCADS11 BSAITM

IF LAB(BCA-DS-107)
S.No Date Program Name Sign

.

IF LAB(BCA-DS-107)
1 21-8- Sending and Receiving mails.

2019
2 22-8- Chatting on the net.
2019
3 28-8- Using FTP and Telnet Server.
2019
4.1 29-8- Using HTML Tags(Table)
2019
4.2 4-8- Using HTML Tags(Form)
2019
4.3 5-9- Using HTML Tags(Image)
2019
4.4 11-9- Using HTML Tags(Anchor)
2019
5 12-9- Write a program to create various types of list(Ordered,
2019 Unordered)
6 18-9- Write a program to create Chess board.
2019
7 19-9- Write a program to create Time Table.(Advanced Tags)
2019
8 25-9- Write a program to create frames.
2019
9 26-9- Write a program to create various tags in HTML.
2019
10 9-10- Write a program to use CSS in HTML.
2019
11 10-10- Making a web page of your college website using HTML tags.
2019
12 15-10- Write a program for blinking text and Moving text on the
2019 screen.
13 23-10- Write a program for creating Nested Frame.
2019
14 31-10- Write a program for creating Nested List.
2019
15 6-11- Write a program for creating an Registration Application
2019 Form in HTML.
16 7-11- Small website of your college
2019 (Minimum Four web page)
&
13-11-
2019,
Introduction To HTML
Introduction -
HTML stands for Hyper Text Markup Language, which is the most widely used language on
Web to develop web pages. HTML was created by Berners-Lee in late 1991 but "HTML 2.0"
was the first standard HTML specification which was published in 1995. HTML 4.01 was a
major version of HTML and it was published in late 1999. Though HTML 4.01 version is widely

IF LAB(BCA-DS-107)
used but currently we are having HTML-5 version which is an extension to HTML 4.01, and this
version was published in 2012.
● Hypertext refers to the way in which Web pages (HTML documents) are linked together.
Thus, the link available on a webpage is called Hypertext.
● As its name suggests, HTML is a Markup Language which means you use HTML to
simply "mark-up" a text document with tags that tell a Web browser how to structure it to
display.
● Originally, HTML was developed with the intent of defining the structure of documents
like headings, paragraphs, lists.
Basic HTML Document
In its simplest form, following is an example of an HTML document −

<html>
<head>
<title>This is document title</title>
</head>
<body>
<h1>This is a heading</h1>
Document content goes here.....
</body>
</html>
Program - 1
Q1. Write a program in HTML using font tag and it’s attributes. (Font, Color,
Face) ?
Answer - Attributes

IF LAB(BCA-DS-107)
Within an HTML tag, an attribute dictates certain aspects of an HTML element. Attributes are
made up of a name and value pair; all tags support standard attributes. The tag is
deprecated, but at one time it utilized the unique attributes contained in the following table.
At ibute Description
tr
co Designates the color of
lor text.
f Designates the look of

a text.
c
e
si Designates the size of

z text.
e
Program Code
<HTML>
<HEAD>
<TITLE>BSAITM</TITLE>
</head>
<BODY>
<marque> welcome</marque>
WELCOME TO
BSAITM 
WELCOME TO
BSAITM 
WELCOME TO
BSAITM 
WELCOME TO
BSAITM 

IF LAB(BCA-DS-107)
WELCOME TO

BSAITM 
WELCOME TO
BSAITM 
WELCOME TO
BSAITM 
</BODY></HTML>
Result
Program - 2

IF LAB(BCA-DS-107)
Q2.Write a program in HTML for formatting the text i.e. Align, Underline, Bold,
Italic, Sup, Sub etc?
Answer - Attributes
HTML also defines special elements for defining text with a special meaning.HTML uses
elements like and for formatting output, like bold or italic text.Formatting elements were
designed to display special types of text:
Attribute Description
 Defines bold text
We live in an age when we have forgotten what life is all
 Defines emphasized text
about.
 Defines italic text
 Defines smaller text
 Defines important text
 Defines subscripted text
 Defines superscripted text
Program Code
<ins> Defines inserted text
<del> Defines deleted text
<HTML>
 Defines marked/highlighted
text <HEAD>
</head>
<BODY>
 Defines bold text 
Defines emphasized
 text 
 Defines italic text 
 Defines smaller text 

Defines important

text 
Defines subscripted

text 
 Defines superscripted
IF LAB(BCA-DS-107)
text 
<ins> Defines inserted text</INS> 
<del> Defines deleted text</DEL> 

Defines marked/highlighted
 text 
</BODY>
</HTML>
Result

IF LAB(BCA-DS-107)
Program - 3
Q3.Write a program in HTML for making a Blink text ?
Answer -
The HTML Blink Element ( <blink> ) is a non-standard element which causes the enclosed text
to flash slowly. Do not use this element as it is obsolete and is bad design practice. Blinking text
is frowned upon by several accessibility standards and the CSS specification allows browsers to
ignore the <blink> element.
Program Code
<html><head>
<title>hey</title></head><body>
<blink>hey yawhatsupp</blink>
</body></html>
Result
IF LAB(BCA-DS-107)
Program- 4
Q4. Write a program in HTML for moving text on the screen in different
directions ?
Answer –
An HTML marquee is a scrolling piece of text displayed either horizontally across or vertically
down your webpage depending on the settings. This is created by using HTML <marquees> tag.
Program Code
<HTML>
<HEAD>
<TITLE>this is my webpage</TITLE>
</head>
<BODY>

IF LAB(BCA-DS-107)
<marquee direction="right">welcome</marquee>
<marquee direction="left>welcome</marquee>
<marquee direction=up>welcome</marquee>
<marquee direction=down>welcome</marquee>
</BODY>
</HTML>
Result

IF LAB(BCA-DS-107)
Program - 5
Q5. Write a program in HTML for adding a pictures in the websites ?
Answer –
In HTML, images are defined with the <img> tag.

The <img> tag is empty, it contains attributes only, and does not have a closing tag.
The src attribute specifies the URL (web address) of the image:
Program Code
<html><head>

IF LAB(BCA-DS-107)
<title>About some wonder of the world </title>
</head><body><center>
About some wonder of the
world 
RED FORT:-Red Fort is a historic fort in the city of Delhi in
India. It was the main residence of the emperors of the Mughal dynasty for nearly 200
years, until 1856.[1] It is located in the center of Delhi and houses a number of museums.
In addition to accommodating the emperors and their households, it was the ceremonial
and political center of the Mughal state and the setting for events critically impacting the
region.
<img src="https://thumbs.dreamstime.com/z/red-fort-new-delhi-india-detailed-vector-sketch-ill
ustration-lal-qila-111560661.jpg"height=50% width=50%>
A mausoleum commissioned for the wife of Mughal Emperor
Shah Jahan, the Taj Mahal was built between 1632 and 1648. Considered the most perfect
specimen of Muslim art in India, the white marble structure actually represents a number
of architectural styles, including Persian, Islamic, Turkish and Indian. The Taj Mahal also
encompasses formal gardens of raised pathways, sunken flower beds and a linear
reflecting pool.
<imgsrc="http://www.drawingskill.com/wp-content/uploads/1/Taj-Mahal-Art394x279.png"heig
ht=50% width=50%>
Built between the 5th century B.C. and the 16th century, the
Great Wall of China is a stone-and-earth fortification created to protect the borders of the
Chinese Empire from invading Mongols. The Great Wall is actually a succession of
multiple walls spanning approximately 4,000 miles, making it the world's longest
manmade structure.
<img src="http://getdrawings.com/image/the-great-wall-of-china-drawing-51.jpg"height=50%
width=50%>

IF LAB(BCA-DS-107)
Rome's, if not Italy's, most enduring icon is undoubtedly its
Colosseum. Built between A.D. 70 and 80 A.D., it was in use for some 500 years. The
elliptical structure sat nearly 50,000 spectators, who gathered to watch the gladiatorial
events as well as other public spectacles, including battle reenactments, animal hunts and
executions. Earthquakes and stone-robbers have left the Colosseum in a state of ruin, but
portions of the structure remain open to tourists, and its design still influences the
construction of modern-day amphitheaters, some 2,000 years later.
<imgsrc="https://encryptedtbn0.gstatic.com/images?q=tbn:ANd9GcSqgdFJQKO5OudXiM3HD
Mrvd7whNKcCI3vbjCS-v2yhJjnGt67r8A"height=50% width=50%>
</body></html>

IF LAB(BCA-DS-107)
Result

IF LAB(BCA-DS-107)

IF LAB(BCA-DS-107)
Program - 6
Q6. Write a program in HTML for making a Ordered list ?
Answer -
Ordered lists are used for lists of items for which the order of the items does matter. The syntax
for an ordered list is exactly the same as for an unordered list. However, to create an ordered list,
the ol tag is used rather than the ul tag. By making this one change, we can convert the unordered
list in our previous example into an ordered list.
Program Code
<html><head>
<title>how to create ordered list</title>
</head><body>
<center>Ordered List</center>
List of Fruits
<ol type=''1">
<li>Apple
<li>Mango
<li>Banana
<li>Orange
<li>Kiwi
</ol>
<ol type="A">
<li>Lo<li>Mo<li>Ko<li>To
<li>Do</ol>
<ol type="a">

IF LAB(BCA-DS-107)
<li>Aman<li>Rohit
<li>Manish
<li>Raj
<li>Jatin
</ol>
<ol type="i">
<li>1<li>2<li>3<li>4<li>5
</ol>
<ol type="I">
<li>10<li>100<li>1000<li>10000<li>100000
</ol>
</body>
</html>
Result

IF LAB(BCA-DS-107)
Program - 7
Q7. Write a program in HTML for making a Unordered list ?
Answer -
Unordered (bulleted) lists are used when a set of items can be placed in any order. An example is
a shopping list:
● Milk
● Bread
● Butter
● Coffee beans
Unordered lists use one set of <ul></ul> tags wrapped around one or more sets of <li></li> tags.
Program Code
<HTML>
<HEAD>
</head>
<BODY>
Shopping list:-
<ul>
<li>bread</li>
<li>coffee beans</li>
<li>milk</li>
<li>butter</li>
</ul>
</BODY></HTML>

IF LAB(BCA-DS-107)
Result

IF LAB(BCA-DS-107)
Program: - 8
Q8.Write a program in HTML for making a Nested list ?
Answer -
A nested list is a list within a list. If you've ever created a bulleted outline in a word processing
document you probably used a variety of indentations and bullet point types to denote items that
were subpoints of another item in the outline. This is the effect we're going for when we create
nested lists.
To create a nested list, simply add a new list within a parent list like this:
Program Code
<html><head>
<title>house</title>
</head><body>
<center>Institute under BSAEI</center>

<ol type="1">
<li>BSAITM</li>
<ol type="A">
<li>Courses in BSAITM</li>
<ol type="a">
<li>B.TECH</li>
<ul type="circle">
<li>CSE</li><li>IT</li><li>Civil</li><li>ECE</li><li>ME</li></ul>
<li>BBA</li><li>MBA</li>
</ol></ol>

IF LAB(BCA-DS-107)
<li>BSAIP</li>
<ol type="A">
<li>Courses in BSAIP</li>
<ol type="a">
<li>UG Courses</li>
<ul type="disc">
<li>D.Pharmacy</li><li>B.pharmacy</li>
</ul type="disc">
<li>PG Courses</li>
<ul type="square">
<li>M.Pharmacy</li>
</ul type="square">
<li>BSAIP</li><ol type="A">
<li>Courses in BSAIP</li><ol type="a">
<li>UG Courses</li><ul type="disc">
<li>D.Pharmacy</li><li>B.pharmacy</li>
</ul type="disc">
<li>PG Courses</li><ul type="square">
<li>M.Pharmacy</li>
</ul type="disc">
<li>BSAIL</li>
<ol type="i">
<li>BALLB(5YR)</li><li>LLB(3YR.)</li>
</ol></ol>
</ol></body></html>
Result

IF LAB(BCA-DS-107)
<td>12:45-2:25</td>

IF LAB(BCA-DS-107)
Program - 9
Q9. Write a program in HTML for making a Time Table of your class. ?
Answer –
An HTML table is defined with the <table> tag.

Each table row is defined with the <tr> tag. A table header is defined with the <th> tag. By
default, table headings are bold and centered. A table data/cell is defined with the <td> tag.
Program Code
<HTML>
<HEAD>
</head>
<BODY>
<center>
Time Table BCADS 1 ST SEM
<table border="6">
<tr>
<td>lecture no.</td>
<td>1st</td>
<td>2nd</td>
<td>break</td>
<td>3rd</td>
<td>4th</td>
<td>lunch</td>
<td>5th</td>
<td>6th</td>
<td>7th</td>
</tr>
<tr>
<td>days</td>
<td>8:45-9:45</td>
<td>9:45-10:45</td>
<td>10:45-11:00</td>
<td>11:00-12:00</td>
<td>12:00-12:00</td>
<td>1:00-1:30</td>
<td>1:30-2:25</td>

IF LAB(BCA-DS-107)
<td>2:25-4:15</td>
<td>lunch</td>
</tr>
<tr>
<td>mon</td>
<td>C PROG</td>
<td>IF</td>
<td>B</td>
<td>QA</td>
<td>CFO</td>
<td>L</td>
<td>ALG. CAL.</td>
<td>PC SOFT</td>
<td>PC SOFT</td>
</tr>
<tr>
<td>Tue</td>
<td>ALG. CAL.</td>
<td>C PROG</td>
<td>R</td>
<td>C PROG LAB</td>
<td>C PROG LAB</td>
<td>U</td>
<td>SELF GUIDE</td>
<td>PC SOFT</td>
<td>PC SOFT</td>
</tr>
<tr>
<td>WED</td>
<td>ALG. CAL.</td>
<td>IF</td>
<td>E</td>
<td>C PROG LAB</td>
<td>C PROG LAB</td>
<td>N</td>
<td>SELF GUIDE</td>
<td>IF LAB</td>
<td>IF LAB</td>
</tr>
<tr>
<td>THRUS</td>
<td>ALG. CAL.</td>
<td>IF</td>
<td>A</td>
<td>SPORTS</td>
<td>LIBRARY</td>
<td>C</td>
<td>C PROG</td>
<td>IF LAB</td>
IF LAB(BCA-DS-107)
<td>IF LAB</td>
</tr>
<tr>
<td>FRI</td>
<td>CFO</td>
<td>SELF GUIDE</td>
<td>K</td>
<td>PRESENTATION</td>
<td>PRESENTATION</td>
<td>H</td>
<td>CFO</td>
<td>GD</td>
<td>GD</td>
</tr>
</table>
Made by:AmanpreetDhanjal
</BODY>
</HTML>
Result

IF LAB(BCA-DS-107)
Program- 10
Q11. Write a program in HTML for making a table with adding a images ?
Answer -
Images can be used in tables, either as the background image of the table, or in individual cells.
<TABLE Background = "image_name.jpg">
<TD Background = "image_name.jpg">
Note that the attribute is BACKGROUND. After an equal sign you type the name of the image
you want to use.
Program Code
<html>
<head>
<title>PROGRAM 1</title>
</head>
<body>
<center>
<img src="file:///C:/Users/Ashutosh%20Kushwaha/Desktop/ashutosh%20htmlfile/10231622.jp
g"height=40%,width=100%>
<table border ="6">
<tr>
<td></td>
<td bgcolor="yellow">1</td>
<td>2</td>
<td colspan="2">3</td>

IF LAB(BCA-DS-107)
<td></td>
</tr>
<tr>
<td></td>
<td colspan="2">4</td>
<td>5</td>
<td>6</td>
<td></td>
</tr>
<tr>
<td></td>
<td colspan="2">BSAIP</td>
<td colspan="2">BSAIP</td>
<td></td>
</tr>
<tr>
<td></td>
<td>BBA</td>
<td>MBA</td>
<td>BCA</td>
<td>MCA</td>
<td></td>
</tr>
<table>
<tr>
<td><img src="https://encrypted-tbn0.gstatic.com/images?
q=tbn:ANd9GcSgNFbj5Cg9OYHvBCO
mvWYHeQFlhDJbyfveJkBQ8ORqUjaQRCq2Pw" height="65%",width="90%">

IF LAB(BCA-DS-107)
<img src="https://teja8.kuikr.com/images/QuikrEducation//image/institute/4262/B-S-Anangpur
ia-Institute-of-Technology-Management-BSAITM_1.png"height=70%,width=100%></td
>
</tr>
</table>
</body>
</html>
Result

IF LAB(BCA-DS-107)
Program: - 11
Q12. Write a program in HTML for making a Frame set in Rows ?
Answer -
The simplest way to get a combination of rows and columns is to first set up the "outermost" set
of rows or columns, and then replace the FRAME element in the row (or column) which should
get the "innermost" set with a nested FRAMESET element. To illustrate this, the following
example will define a frameset with two columns. The rightmost column will consist of two rows.
First, define a frameset with two columns: A sketch of the simple 2-column 'outermost' frameset
<FRAMESET COLS="*,*">
<FRAME SRC="leftmost.html" NAME=left>
<FRAME NAME=right>
</FRAMESET>
Program Code
<html>
<head>
<title>Frame set</title>
</head>
<frameset cols="40%,30%">
<frame src="file:///C:/Users/Ashutosh%20Kushwaha/Desktop/nikhil%20htmlfile/ordered%20
list.html">
<frame src="file:///C:/Users/Ashutosh%20Kushwaha/Desktop/nikhil%20htmlfile/bsaitm.html >
</frameset>
</html>

IF LAB(BCA-DS-107)

IF LAB(BCA-DS-107)
Program - 12
Q13.Write a program in HTML for making a Frame set in Column ?
Answer -
The simplest way to get a combination of rows and columns is to first set up the "outermost" set
of rows or columns, and then replace the FRAME element in the row (or column) which should
get the "innermost" set with a nested FRAMESET element. To illustrate this, the following
example will define a frameset with two columns. The rightmost column will consist of two rows.
First, define a frameset with two columns: A sketch of the simple 2-column 'outermost' frameset
<FRAMESET COLS="*,*">
<FRAME SRC="leftmost.html" NAME=left>
<FRAME NAME=right>
</FRAMESET>
Program Code
<html>
<head>
<title>Frame set</title>
</head>
<frameset cols="40%,30%">
<framesrc="file:///C:/Users/Ashutosh%20Kushwaha/Desktop/ashutosh%20htmlfile/ordered%20l
ist.html">
<framesrc="file:///C:/Users/Ashutosh%20Kushwaha/Desktop/ashutosh%20htmlfile/bsaitm.html
>
</frameset></html>

IF LAB(BCA-DS-107)
Program-13
Q-13) HTML Program for making chess board.

<html>
<head>
<title> chess board </title>
</head>
<body>
<center><h1> CHESS-BOARD </H1>
<center><table BORDER="1">
<tr>
<td height="50px" width="50px" bgcolor="black"></td>
<td height="50px" width="50px"></td>
</tr>
IF LAB(BCA-DS-107)
<tr>
<td height="50px" width="50px" bgcolor="black"></td></tr>
<tr>
</tr>
<tr>
</tr>
<tr>
</tr>
<tr>
IF LAB(BCA-DS-107)

</tr>
<tr>
</tr>
<tr>
<td height="50px" width="50px" bgcolor="black"></td></tr>
</body>
</html>

IF LAB(BCA-DS-107)
RESULT :-

Practical File Internet Fundamentals Lab: BCA-DS-107

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

Practical File Internet Fundamentals Lab: BCA-DS-107

Uploaded by

Copyright:

Available Formats

IF LAB(BCA-DS-107)

B.S. Anangpuria Institute of Technology and Management

BallabhgarhSohna Road, Faridabad

Mr. Shravan Kumar Name: Nikhil Satija

Asst. Prof. (BCA Deptt.) 19/BCADS--11

B.S.A.I.T.M. B. C. A. 1st Sem

Nikhil Satija 19/BCADS11 BSAITM

S.No Date Program Name Sign

Nikhil Satija 19/BCADS11 BSAITM

1 21-8- Sending and Receiving mails.

Nikhil Satija 19/BCADS11 BSAITM

Basic HTML Document

In its simplest form, following is an example of an HTML document −

Nikhil Satija 19/BCADS11 BSAITM

f Designates the look of

si Designates the size of

Nikhil Satija 19/BCADS11 BSAITM

<FONT size="5" COLOR ="blue"FONT FACE ="VERDANA">WELCOME TO

Nikhil Satija 19/BCADS11 BSAITM

<small> Defines smaller text</SMALL><BR>

<del> Defines deleted text</DEL><BR>

Nikhil Satija 19/BCADS11 BSAITM

Nikhil Satija 19/BCADS11 BSAITM

<marquee direction="right"><font color="blue" size="5" >welcome</font></marquee>

<marquee direction="left><font color="blue" size="5" >welcome</font></marquee>

<marquee direction=up><font color="blue" size="5" >welcome</font></marquee>

<marquee direction=down><font color="blue" size="5" >welcome</font></marquee>

Nikhil Satija 19/BCADS11 BSAITM

Q5. Write a program in HTML for adding a pictures in the websites ?

In HTML, images are defined with the <img> tag.

Nikhil Satija 19/BCADS11 BSAITM

<title>About some wonder of the world </title>

Nikhil Satija 19/BCADS11 BSAITM

Nikhil Satija 19/BCADS11 BSAITM

Nikhil Satija 19/BCADS11 BSAITM

Nikhil Satija 19/BCADS11 BSAITM

Q6. Write a program in HTML for making a Ordered list ?

<title>how to create ordered list</title>

<font size="7" color="blue"><center><u>Ordered List</u></center></font>

<font size="5" color="RED">List of Fruits</font>

Nikhil Satija 19/BCADS11 BSAITM

Nikhil Satija 19/BCADS11 BSAITM

Q7. Write a program in HTML for making a Unordered list ?

Nikhil Satija 19/BCADS11 BSAITM

Nikhil Satija 19/BCADS11 BSAITM

Q8.Write a program in HTML for making a Nested list ?

<font size="7" color="blue"><center><u>Institute under BSAEI</u></center></font>

<font size="5" color="green">

Nikhil Satija 19/BCADS11 BSAITM

<li>Courses in BSAIP</li><ol type="a">

<li>UG Courses</li><ul type="disc">

<li>PG Courses</li><ul type="square">

Nikhil Satija 19/BCADS11 BSAITM

Nikhil Satija 19/BCADS11 BSAITM

An HTML table is defined with the <table> tag.

Nikhil Satija 19/BCADS11 BSAITM

Nikhil Satija 19/BCADS11 BSAITM

<TABLE Background = "image_name.jpg">

<TD Background = "image_name.jpg">

<table border ="6">

Nikhil Satija 19/BCADS11 BSAITM

Nikhil Satija 19/BCADS11 BSAITM

Nikhil Satija 19/BCADS11 BSAITM