Scribd
Upload
11 views

html practical fillee

The document is an index of various HTML and CSS programs, each illustrating different concepts such as basic HTML structure, text formatting, linking, lists, tables, and styling. Each program includes a code snippet demonstrating the specific feature being taught. The document serves as a practical guide for learning HTML and CSS through examples.

Uploaded by

NARENDER
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
11 views

html practical fillee

The document is an index of various HTML and CSS programs, each illustrating different concepts such as basic HTML structure, text formatting, linking, lists, tables, and styling. Each program includes a code snippet demonstrating the specific feature being taught. The document serves as a practical guide for learning HTML and CSS through examples.

Uploaded by

NARENDER
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 34

INDEX

S.No Programs Page No.


1 W.A.P to illustrate basic in HTML. 1-2
2 W.A.P to illustrate paragraph tag, line 3-4
break, Horizontal rule in HTML.
3 W.A.P to illustrate Formatting taxt in 5-6
HTML.
4 W.A.P to illustrate Background & Text 7-8
Color in HTML.
5 W.A.P to illustrate Hexadecimal Color in 9-10
HTML.
6 W.A.P to illustrate Internal Linking in 11-12
HTML.
7 W.A.P to illustrate External Linking in 13-14
HTML.
8 W.A.P to illustrate Ordered List in HTML. 15-16
9 W.A.P to illustrate Unordered List in 17-18
HTML.
10 W.A.P to illustrate Nested List in HTML. 19-20
11 W.A.P to illustrate Table Tag in HTML. 21-22
12 W.A.P to illustrate Frame Tag in HTML. 23-24
13 W.A.P to illustrate Form Tag in HTML. 25-26
14 W.A.P to illustrate Marquee with 27-29
Background in HTML.
15 W.A.P to illustrate Background image in 30-31
CSS.
16 W.A.P to illustrate Marquee in CSS. 32-34
Program: 1
W.A.P to illustrate basic in HTML.

<!DOCTYPE html>
<html>
<head>
<title>Welcome to HTML</title>
</head>
<body>
<h1>Welcome to HTML</h1>
</body>
</html>
Output:
Program: 2
W.A.P to illustrate paragraph tag, line
break, Horizontal rule in HTML.

<!DOCTYPE html>
<html>
<head>
<title>Paragraph and Line Break</title>
</head>
<body>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<hr>
<p>Line break example:<br>This is after a
line break.</p>
</body>
</html>
Program: 3
Output:
W.A.P to illustrate Formatting taxt in
HTML.
<!DOCTYPE html>
<html>
<head>
<title>Text Formatting</title>
</head>
<body>
<b>Bold Text</b><br>
<i>Italic Text</i><br>
<u>Underlined Text</u><br>
<small>Small Text</small><br>
<big>Big Text</big>
</body>
</html>
Program: 4
Output:
W.A.P to illustrate Background & Text
Color in HTML.
<!DOCTYPE html>
<html>
<head>
<title>Background & Text Color</title>
</head>
<body style="background-color: lightblue;
color: red;">
<h1>This is a heading with a colored
background</h1>
</body>
</html>
Program: 4
Output:
W.A.P to illustrate Hexadecimal Color in
HTML.

<!DOCTYPE html>
<html>
<head>
<title>Hexadecimal Color</title>
</head>
<body style="background-color: #ffcc00;">
<h1>Hexadecimal Background Color</h1>
</body>
</html>
Program: 5
Output:
W.A.P to illustrate Internal Linking in
HTML.

<!DOCTYPE html>
<html>
<head>
<title>Internal Linking</title>
</head>
<body>
<a href="page2.html">Go to Page 2</a>
</body>
</html>
Program: 6
Output:
W.A.P to illustrate External Linking in
HTML.

<!DOCTYPE html>
<html>
<head>
<title>External Linking</title>
</head>
<body>
<a href="https://www.example.com"
target="_blank">Visit Example</a>
</body>
</html>
Program: 7
Output:
W.A.P to illustrate Ordered List in HTML.
<!DOCTYPE html>
<html>
<head>
<title>Ordered List</title>
</head>
<body>
<ol>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ol>
</body>
</html>
Program: 8
Output:
W.A.P to illustrate Unordered List in
HTML.
<!DOCTYPE html>
<html>
<head>
<title>Unordered List</title>
</head>
<body>
<ul>
<li>Apple</li>
<li>Banana</li>
<li>Cherry</li>
</ul>
</body>
</html>
Program: 9
Output:
W.A.P to illustrate Nested List in HTML.

<!DOCTYPE html>
<html>
<head>
<title>Nested List</title>
</head>
<body>
<ul>
<li>Fruits
<ul>
<li>Apple</li>
<li>Banana</li>
</ul>
</li>
<li>Vegetables
<ul>
Program:<li>Carrot</li>
10
<li>Broccoli</li>
</ul>
</li>
</ul>
</body>
</html>
Output:
Program: 11
W.A.P to illustrate Table Tag in HTML.

<!DOCTYPE html>
<html>
<head>
<title>Table Example</title>
</head>
<body>
<table border="1">
<tr>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td>Alice</td>
<td>25</td>
</tr>
<tr>
<td>Bob</td>
<td>30</td>
</tr>
</table>
</body>
</html>
Program: 12
Output:
W.A.P to illustrate Frame Tag in HTML.

<!DOCTYPE html>
<html>
<frameset cols="50%,50%">
<frame src="page1.html">
<frame src="page2.html">
</frameset>
</html>
Program: 12
Output:
W.A.P to illustrate Form Tag in HTML.
<!DOCTYPE html>
<html>
<head>
<title>HTML Form</title>
</head>
<body>
<form>
Name: <input type="text"><br>
Email: <input type="email"><br>
<input type="submit">
</form>
</body>
</html>
Program: 13
Output:

Background in HTML.
<!DOCTYPE html>
<html>
<head>
<title>Marquee with Background</title>
<style>
body {
background-image:
url('background.jpg');
background-size: cover;
}
</style>
</head>
<body>
<marquee>Welcome to HTML with
Marquee</marquee>
</body>
</html>
Program: 14
W.A.P to illustrate Marquee with
Output:

Background image in CSS.


<!DOCTYPE html>
<html>
<head>
<style>
body {
background-image: url('your-
image.jpg');
background-size: cover;
}
</style>
</head>
<body>
<marquee behavior="scroll"
direction="left" style="color:white; font-
size:30px;">
Welcome
Program: 15 to My Website!
W.A.P to illustrate Marquee with
</marquee>

<h1>Hello World!</h1>

</body>
</html>
Output:

You might also like