Scribd
Upload
5 views

EXPIREMENT HTML

Bca 1st sem internet technology lab experiments of html

Uploaded by

Mamta nagar
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
5 views

EXPIREMENT HTML

Bca 1st sem internet technology lab experiments of html

Uploaded by

Mamta nagar
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/ 19

EXPIREMENT-1

QUESTION:

Design your first webpage displaying a big heading and small paragraph using HTML?

CODE:

<!DOCTYPE html>

<html>

<head>

<title>My First Webpage</title>

</head>

<body>

<h1>Welcome to My First Webpage</h1>

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

</body>

</html>

Code:

Page 1
Result:

Page 2
EXPIREMENT-2

QUESTION:

Design a web page displaying “My first web page by adding following tags including font
change, color change and changed font size using HTML?

CODE:

<!DOCTYPE html>

<html>

<head>

<title>My First Webpage</title>

</head>

<body>

<h1 style="font-family: Arial; color: black; font-size: 38px;">

My First Webpage

</h1>

<p style="font-family: Arial; color: red; font-size: 28px;">

This is a small paragraph

</p>

</body>

</html>

Page 3
Code:

Result:

Page 4
EXPIREMENT-3
QUESTION:

Write a HTML program to display text using different attributes like left alignment, center
alignment, center alignment, and style attribute (to and color).

 CODE:

<!DOCTYPE html>

<html>

<head>

<title>Text Alignment and Styling</title>

</head>

<body>

<h2 style="color: blue; text-align: left;">Left aligned text</h2>

<p style="color: blue; text-align: left;">This is a left-aligned text with blue color style.</p>

<h2 style="color: green; text-align: center;">Center aligned text</h2>

<p style="color: green; text-align: center;">This is a center-aligned text with green color
style.</p>

<h2 style="color: red; text-align: right;">Right aligned text</h2>

<p style="color: red; text-align: right;">This is a right-aligned text with red color
style.</p>

</body>

</html>

Page 5
 SCREENSHOT OF CODE AND ITS RESULT:
Code:

Result:

Page 6
EXPIREMENT-4
QUESTION:

Write a HTML program to display text using different formatting styles like bold text, italic
text, underlined text, strike text, monospaced font, superscript text, subscript text, inserted
text, inserted text, deleted text, large text, smaller text, and grouping content?

 CODE:

<!DOCTYPE html>

<html>

<head>

<title>Text Formatting Styles</title>

</head>

<body>

<!-- Bold Text -->

<p><b>This is bold text.</b></p>

<!-- Italic Text -->

<p><i>This is italic text.</i></p>

<!-- Underlined Text -->

<p><u>This is underlined text.</u></p>

<!-- Strikethrough Text -->

<p><s>This is strikethrough text.</s></p>

<!-- Monospaced Font -->

<p><tt>This is monospaced text.</tt></p>

<!-- Superscript Text -->

<p>This is superscript text: H<sup>2</sup>O</p>

<!-- Subscript Text -->

<p>This is subscript text: CO<sub>2</sub></p>

<!-- Inserted Text -->

<p><ins>This is inserted text.</ins></p>

Page 7
<!-- Deleted Text -->

<p><del>This is deleted text.</del></p>

<!-- Large Text -->

<p><big>This is large text.</big></p>

<!-- Smaller Text -->

<p><small>This is smaller text.</small></p>

<!-- Grouping Content -->

<div>

<h2>Grouped Content</h2>

<p>This is a paragraph inside a div element.</p>

</div>

</body>

</html>

Page 8
 SCREENSHOT OF CODE AND ITS RESULT:
Code:

Page 9
Result:

Page 10
EXPIREMENT-5
QUESTION:

Write a program using different phrase tags like; emphasized text, marked text, strong text,
text abbreviation, acronym element, text direction, special terms, quoting text, short
quotations, text citation, computer code, keyboard text, programing variables, program
output, and address text.

 CODE:

<!DOCTYPE html>

<html>

<head>

<title>Phrase Tags Example</title>

</head>

<body>

<!-- Emphasized Text -->

<p><em>This is emphasized text.</em></p>

<!-- Marked Text -->

<p><mark>This is marked text.</mark></p>

<!-- Strong Text -->

<p><strong>This is strong text.</strong></p>

<!-- Text Abbreviation -->

<p>The abbreviation for HyperText Markup Language is <abbr title="HyperText


Markup Language">HTML</abbr>.</p>

<!-- Acronym Element -->

<p>The acronym for World Health Organization is <acronym title="World Health


Organization">WHO</acronym>.</p>

Page 11
<!-- Text Direction -->

<p><bdo dir="rtl">This text is displayed right-to-left.</bdo></p>

<!-- Special Terms -->

<p><dfn title="Definition">HTML</dfn> is the standard markup language for creating


web pages.</p>

<!-- Quoting Text -->

<p>He said, <q>HTML is easy to learn.</q></p>

<!-- Short Quotations -->

<p><q>To be, or not to be, that is the question.</q></p>

<!-- Text Citation -->

<p><cite>Shakespeare</cite> wrote many famous plays.</p>

<!-- Computer Code -->

<p>To print "Hello, World!" in Python, use <code>print("Hello,


World!")</code>.</p>

<!-- Keyboard Text -->

<p>Press <kbd>Ctrl</kbd> + <kbd>C</kbd> to copy text.</p>

<!-- Programming Variables -->

<p>The value of <var>x</var> is 10.</p>

<!-- Program Output -->

<p>The program output is: <samp>Hello, World!</samp></p>

Page 12
<!-- Address Text -->

<address>

Written by Kislay Rai.<br>

Visit us at:<br>

Example.com<br>

Box 564, GBU LAND<br>

India

</address>

</body>

</html>

Page 13
 SCREENSHOT OF CODE AND ITS RESULT:

Code:

Page 14
Result:

Page 15
EXPIREMENT:6
QUESTION:

Write an HTML code to display your education details in tabular format.

 CODE:

<!DOCTYPE html>

<html>

<head>

<title>Education Details</title>

</head>

<body>

<h1>My Education Details</h1>

<table border="1">

<tr>

<th>Degree</th>

<th>Institution</th>

<th>Year of Passing</th>

<th>Grade</th>

</tr>

<tr>

<td>Tenth</td>

<td>Uma public school</td>

<td>2021-22</td>

<td>b+</td>

</tr>

<tr>

<td>twelth</td>

<td>Azad public school </td>

Page 16
<td>2023-24</td>

<td>b+</td>

</tr>

<tr>

<td>Graduation </td>

<td>perusing from gautam buddha University </td>

<td>2024- first year</td>

<td> </td>

</tr>

</table>

</body>

</html>

Page 17
 SCREENSHOT OF CODE AND ITS RESULT:

Code:

Page 18
Result:

Page 19

You might also like