Scribd
Upload
72 views14 pages

Experiment 2

The document provides code to create an HTML file with various tags such as headings, paragraphs, bold, italics, underline, font colors, and alignments. It includes the syntax for each tag and examples of how to implement them. The tags covered are HTML, head, body, title, headings H1-H6, paragraph, bold, italics, underline, font, line break, and empty non-container tags. An example HTML file is also provided that implements many of these tags.

Uploaded by

Hari Shankar Singh
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
72 views14 pages

Experiment 2

The document provides code to create an HTML file with various tags such as headings, paragraphs, bold, italics, underline, font colors, and alignments. It includes the syntax for each tag and examples of how to implement them. The tags covered are HTML, head, body, title, headings H1-H6, paragraph, bold, italics, underline, font, line break, and empty non-container tags. An example HTML file is also provided that implements many of these tags.

Uploaded by

Hari Shankar Singh
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 14

EXPERIMENT 2

Q) Create an HTML File for displaying a webpage with the following tags : bold, italics,
underline, alignment, paragraph, text color, headings. The file should contain a brief
description about all the tags.

• HTML tag: It is the root of the html document which is used to specify that the
document is html.

Syntax:

<html> Statements... </html>

• Head tag: Head tag is used to contain all the head element in the html file. It
contains the title, style etc.

Syntax:

<head> Statements... </head>

• Body tag: It is used to define the body of html document. It contains image, tables,
lists, … etc.

Syntax:

<body> Statements... </body>

• Title tag: It is used to define the title of html document.

Syntax:

<title> Statements... </title>

• Heading tag: It is used to define the heading of html document.

Syntax:

<h1> Statements... </h>

<h2> Statements... </h2>

<h3> Statements... </h3>


<h4> Statements... </h4>

<h5> Statements... </h5>

<h6> Statements... </h6>

Code:

<h1>Heading 1 </h1>

<h2>Heading 2 </h2>

<h3>Heading 3 </h3>

<h4>Heading 4 </h4>

<h5>Heading 5 </h5>

<h6>Heading 6 </h6>

• Paragraph tag: It is used to define paragraph content in html document.

Syntax:

<p> Statements... </p>

• Bold tag: It is used to specify bold content in html document.

Syntax:

<b> Statements... </b>

• Italic tag: It is used to write the content in italic format.

Syntax:

<i> Statements... </i>

filter_none

• Underline tag: It is used to set the content underline.

Syntax:

<u> Statements... </u>

• Font tag: It is used to specify the font size, font color and font-family in html
document.
Syntax:

<font> Statements ... <font>

Empty (Non-Container) Tags:

• Line break tag: It is used to break the line.

Syntax:

<br>

Code :

<html>

<head>

<title> Working Document </title>

</head>

<body bgcolor="orange">

<h1>This is Heading 1</h1><hr/>

<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>


<pre> <b> Defines bold text </b>

<i> Defines italic text </i>

<u> Underlines a text </u>

</pre>

<p> Defines bold text

Defines italic text <br/>

Underlines the text

</p>

<p align="center"><font color= "black">Align feature is used to align the text in left,
center or right.</font></p>

</body>

</html>
Experiment 3
Q) Create your resume in html. Include details such as career objectives, educational
qualifications, achievements, strenghts and a recent photo.

Code :

<html> <head> <title>RESUME</title>

</head> <body bgcolor="lavender">

<h2 align="center"><u>RESUME</u></h2><hr/>

<h2 align="center"><u>Aryaman Singh</u></h2><hr/>

<h2><u><font color="green">Objectives</u></font></h2>

<img src="https://mail.google.com/mail/u/0?
ui=2&ik=4248fc50f9&attid=0.1&permmsgid=msg-a:r-
2227906622244049571&th=166a4624f7774aaf&view=att&disp=safe&realattid=f_jnmoa1p
p0" height="164px" width="120px" alt="Aryaman Singh" border="5px" align="right">

<hr/>

<pre>

1) To have a fulfilling career

2) Achieve Success and Financial Stability

<p>

<h2><font color="green"><u>Educational Qualification</u></font></h2><hr/>

<pre>

Qualification Year Institute Percentage/CGPA

BBA 2019-22 Maharaja Surajmal Pursuing

12th 2018-19 DPS Gurgaon 85%

10th 2016-17 DPS Gurgaon 9.2 CGPA

<h2><u><font color="green">Achievements</u></font></h2><hr/>

<pre> 1. Best Delegate in MUN

2. First Prize in Debating Competition

<h2><u><font color="green">Strengths</u></font></h2><hr/>

<pre>

1) Creativity

2) Communication Skills

3) Decision Making Skills

<h2><u><font color="green">Hobbies</u></font></h2><hr/>

<pre>

1) Music

2) Art

</body> </html>
EXPERIMENT 4
Q) Design a website entitled HTML Tutorial with links to 5 different web pages. Use the
hyperlink functionality to do this experiment.

Code :

<html>

<header><font color="red"><h1 align="center">HTML Tutorial</h1></font></header>

<body bgcolor="green">

<p><font color="yellow">This is the best html tutorial in the world </p>

<p> you will learn the following topics in this tutorial : </font> </p>

<a href="htmlintroduction.html">html introduction</a> <br>

<a href="htmlimages.html">html images</a> <br>

<a href="htmlattributes.html">html attributes</a><br>

<a href="htmlelements.html"> html elements</a><br>

<a href="htmlformatting.html">html formatting</a>

</body>

</html>
EXPERIMENT 5
Q) Create a Nested List and insert an image of a computer on the top right of the web
page and display a marquee displaying “input and output Devices”.
Code :

<html> <body> <body bgcolor="green"> <h2 align="center"><u> Nested List</u></h2>

<marquee width="100%" direction="left" height="25px" scrollamount="10"


bgcolor="red">

<font color="yellow"><b> Input and Output Devices</b> </font> </marquee><b>

<img src="C:\Users\Student\Desktop\images.jpg" height="100ppx" width="100ppx"


align="right">

<p>Computer System</p> <ol type="1">

<li>input Devices</li>

<ol type="i">
<li>Keyboard</li>

<li>mouse</li>

<li>joystick</li>

<li>scanner</li>

<ol type="a">

<li> Flat Bed Scanner</li>

<li> Hand Held Scanner</li>

</ol>

</ol>

<li>Output Devices</li>

<ol type="i">

<li>Monitor</li>

<ol type="a">

<li>LCD</li>

<li>CRT</li>

</ol>

<li>Printer</li>

<ol type="a">

<li> Impact Printer</li>

<li> Non Impact Printer</li> </ol> </ol>

</ol>

</b>

</body></html>
EXPERIMENT 6
Q) Create an HTML webpage similar to the one displayed below. Use the nested list
functionality and also use marquee tags.

OUTPUT :
Code :

<html>

<head>

<title> EComm Experiment 3 </title>

</head>

<body bgcolor="yellow">

<h1 style = "background-color:black; color:white;"> FRUITS AND VEGETABLES</h1>

<ol type="A">

<li>vegetables </li>

<ul>

<li>onion</li>

<li>tomato</li>

<li>radish</li>

<li>potato</li>

<li>carrot</li>

</ul>
<li>fruits</li>

<ul>

<li>apple</li>

<li>banana</li>

<li>watermelon</li>

<li>mango</li>

<li>grapes</li>

</ul>

</ol>

<h1 style = "background-color:black; color:white;" ><marquee


direction=right>NEWSPAPER AND MAGAZINE</marquee></h1>

<ul type="circle">

<li>newspaper</li>

<ol type="1" start= "5">

<li>the hindu </li>

<li>hindustan times</li>

<li>navbharat</li>

<li>punjab kesari</li>

<li>dainik jagran</li>

</ol> <li>magazine</li> <ol type="i">

<li>business times</li>

<li>the week </li>

<li>harvard business review</li>

<li>computer world </li>

</ol>

</ul> </body> </html>

You might also like