Scribd
Upload
6 views25 pages

AR HTML File

html

Uploaded by

simrandeo444
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
6 views25 pages

AR HTML File

html

Uploaded by

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

Program File On-

Web Designing using


HTML

Anurag Singh
PGDCA (Sem-1)
249467
S. No Program Discription
1 To write a program using Text Formatting Tags in HTML
2 To write a program using Heading Tags in HTML
3 To write a program using Paragraph Tag in HTML
4 To write a program using Unpaired Tags in HTML
5 To write a program using Font Tag in HTML
6 To write a program using Body Tag and its attributes in HTML
7 To write a program using Marquee Tag and its attributes in
HTML
8 To write a program using List Tag in HTML
9 To write a program using Ordered List Tag in HTML
10 To write a program using Unordered List Tag in HTML
11 To write a program using Nested List Tag in HTML
12 To write a program using Table Tag and its attributes in HTML
13 To write a program using Colspan attribute in Table with BG
Color in HTML
14 To write a program using Rowspan attribute in Table in HTML
15 To write a program using Cell Spacing attribute in Table in
HTML
16 To write a program using Cell Padding attribute in Table in
HTML
17 To write a program using External Linking Tag in HTML
18 To write a program using Internal Linking Tag in HTML
19 To write a program using IMG Source Tag in HTML
1. To write a program using Text Formatting Tags
<html>

<head>

<title>Text Formatting Tags</title>

</head>

<body>

<h1>Text Formatting Tags in HTML</h1>

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

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

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

<p><strong>This text is important (strong).</strong></p>

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

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

<p><strike>This text is striked.</strike></p>

<p>235<sub>This is subscript text.</sub></p>

<p>235<sup>This is superscript text.</sup></p>

</body>

</html>

Output :-
2. To write a program using Heading Tags in HTML
<html>

<head>

<title>Heading Tags from H1 to H6</title>

</head>

<body>

<h1>This is Heading 1 with Biggest appearance </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 with Smallest appearance </h6>

</body>

</html>

Output :-
3. To write a program using Paragraph Tag in HTML
<html>

<head>

<title>Paragraph Tag </title>

</head>

<body>

<h1>Paragraph Tag in HTML</h1>

<p>I Am Anurag and here I am using Paragraph tag. The paragraph tag is used to define blocks of text,
and it automatically adds some space before and after the paragraph.</p>

<p>This is the second line of Paragraph.</p>

<p>This is the third line of paragraph. Paragraph tags make it easy to separate text into readable
sections.</p>

</body>

</html>

Output :-
4. To write a program using Unpaired Tags in HTML
<html>

<head>

<title>Unpaired Tags </title>

</head>

<body>

<h1>Unpaired Tags in HTML</h1>

<p>This is an example of a line break tag and it is an sigular tag which means it only contains an
opening tag.<br>This text appears on a new line.</p>

<p>This is an example of a horizontal line:</p>

<hr>

</body>

</html>

Output :-
5. To write a program using Font Tag in HTML
<html>

<head>

<title>Font Tag </title>

</head>

<body>

<h1>Using the Font Tag in HTML</h1>

<p><font color="red">This text will appear red in color.</font></p>

<p><font size="5">This text appear larger (size 5).</font></p>

<p><font face="Arial">This text is displayed in the Arial font.</font></p>

<p><font color="blue" size="4" face="Times New Roman">This text is blue, size 4, and in Times New
Roman font.</font></p>

</body>

</html>

Output :-
6. To write a program using Body Tag and its attributes in HTML
<html>

<head>

<title>Body Tag and its attributes </title>

</head>

<body bgcolor="#f0f8ff" text="#000080" link="#ff4500" vlink="#8b008b" alink="#ff6347">

<h1>Using the Body Tag and Its Attributes</h1>

<p>This program demonstrates various attributes of the body tag.</p>

<p> The <b>bgcolor</b> attribute sets the background color of the page (light blue here).</p>

<p> The <b>text</b> attribute sets the color of the text.</p>

<p> The <b>link</b> attribute sets the color of unvisited links.</p>

<p> The <b>vlink</b> attribute sets the color of visited links.</p>

<p> The <b>alink</b> attribute sets the color of active links when clicked.</p>

<p>Here is an example of a <a href="https://www.Anurag.com">link</a> to test the link colors.</p>

</body>

</html>

Output :-
7. To write a program using Marquee Tag and its attributes in HTML
<html>

<head>

<title>Marquee Tag </title>

</head>

<body>

<h1>Using the Marquee Tag and Its Attributes</h1>

<marquee>Welcome to the HTML Tutorial.com</marquee>

<marquee direction="right" bgcolor="#f0e68c" style="color:blue;">This text moves from left to


right.</marquee>

<marquee direction="up" scrollamount="2" height="100">This text scrolls upward.</marquee>

<marquee direction="down" scrollamount="10" height="100" bgcolor="#dcdcdc">This text scrolls


downward quickly.</marquee>

<marquee behavior="alternate" width="50%">This text will move in alternate direction.</marquee>

<marquee loop="3">This text will scroll 3 times and then stop.</marquee>

</body>

</html>

Output :-
8. To write a program using List Tag in HTML
<html>

<head>

<title>List Tags </title>

</head>

<body>

<h1>Using List Tags in HTML</h1>

<h2>Unordered List</h2>

<ul>

<li>Anurag</li>

<li>Gurleen</li>

<li>Honey</li>

</ul>

<h2>Ordered List</h2>

<ol>

<li>First </li>

<li>Second </li>

<li>Third </li>

</ol>

<h2>Definition List</h2>

<dl>

<dt>HTML</dt>

<dd>HyperText Markup Language</dd>

</dl>

</body>
</html>

Output :-

9. To write a program using Ordered List Tag in HTML


<html>

<head>

<title>Ordered List</title>

</head>

<body>

<h1>Ordered List</h1>

<h2>PGDCA Students Detail</h2>

<ol>

<li>Anurag</li>

<li>Gurleen</li>

<li>Sukhjinder</li>

</ol>

<h2>Detail Starting from no. 4</h2>

<ol start="4">

<li>Raman</li>
<li>Jot</li>

</ol>

</body>

</html>

Output :-
10. To write a program using Unordered List Tag in HTML
<html>

<head>

<title>Unordered List </title>

</head>

<body>

<h1>PGDCA Students Name</h1>

<ul type="Square">

<li>Anurag</li>

<li>Gurleen</li>

<li>Sukh</li>

</ul>

</body>

</html>

Output :-
11. To write a program using Nested List Tag in HTML
<html>

<head>

<title>Nested List</title>

</head>

<body>

<h1>Nested List</h1>

<ul>

<li>Anurag</li>

<li>Gurleen</li>

</ul>

<ul>

<li>PGDCA</li>

</ul>

<ol>

<li>249467</li>

<li>249466</li>

</ol>

</body>

</html>

Output :-
12. To write a program using Table Tag and its attributes in HTML
<html>

<head>

<title>To Create a Table </title>

</head>

<body>

<h1>HTML Table</h1>

<table border="1" cellpadding="15" cellspacing="0">

<caption>PGDCA Students 24-25</caption>

<tr>

<th>Name</th>

<th>Age</th>

<th>City</th>

</tr>

<tr>

<td bgcolor="blue">Anurag</td>

<td>24</td>

<td>FGS</td>

</tr>

<tr>

<td bgcolor="green">Gurleen</td>

<td>22</td>

<td>Ludhiana</td>

</tr>

<tr>
<td bgColor="red">Sukh</td>

<td>26</td>

<td>Fazilka</td>

</tr>

</table>

</body>

</html>

Output :-
13. To write a program using Colspan attribute in Table with BG Color
in HTML
<html>

<head>

<title>Table with Colspan attribute</title>

</head>

<body>

<h1>Creating table using Colspan</h1>

<table border="1" bgcolor="#f0f8ff">

<tr>

<th colspan="2">Student Information</th>

</tr>

<tr>

<td>Name</td>

<td>Age</td>

</tr>

<tr>

<td>Anurag</td>

<td>20</td>

</tr>

<tr>

<td>Guri</td>

<td colspan="2">25</td>

</tr>

</table>
</body>

</html>

Output :-

14. To write a program using Rowspan attribute in Table in HTML


<html>

<head>

<title>Rowspan </title>

</head>

<body>

<h1>Table with Rowspan</h1>

<table border="1">

<tr>

<th>Name</th>
<th>Age</th>

<th>City</th>

</tr>

<tr>

<td>Anurag</td>

<td>22</td>

<td>Sirhind</td>

</tr>

<tr>

<td rowspan="2">Gur</td>

<td>25</td>

<td>Lopon</td>

</tr>

<tr>

<td>26</td>

<td>Sirhind</td>

</tr>

</table>

</body>

</html>

Output :-
15. To write a program using Cell Spacing attribute in Table in HTML
<html>

<head>

<title>Table with Cellspacing Example</title>

</head>

<body>

<h1>Table with Cellspacing</h1>

<table border="1" cellspacing="10">

<tr>

<th>Name</th>

<th>Age</th>

<th>City</th>

</tr>

<tr>

<td>Anu</td>

<td>24</td>

<td>Sirhind</td>

</tr>

<tr>

<td>Sukh</td>

<td>26</td>

<td>Fazilka</td>

</tr>
</table>

</body>

</html>

Output :-

16. To write a program using Cell Padding attribute in Table in HTML


<html>

<head>

<title>Table with Cellpadding Example</title>

</head>

<body>

<h1>Table with Cellpadding</h1>

<table border="1" cellpadding="15">

<tr>

<th>Name</th>

<th>Age</th>
<th>City</th>

</tr>

<tr>

<td>Anu</td>

<td>24</td>

<td>Sirhind</td>

</tr>

<tr>

<td>Sukh</td>

<td>26</td>

<td>Fazilka</td>

</tr>

</table>

</body>

</html>

Output :-
17. To write a program using External Linking Tag in HTML
<html>

<head>

<title>External Linking</title>

</head>

<body>

<h1>External Link</h1>

<p>Click the link below to visit an external website:</p>

<a href="https://www.youtube.com">Click Here </a>

</body>

</html>

Output :-
18. To write a program using Internal Linking Tag in HTML
<html>

<head>

<title>Internal Linking Example</title>

</head>

<body>

<h1>Internal Linking</h1>

<p><a href="#section1">Go to Section 1</a></p>

<p><a href="#section2">Go to Section 2</a></p>

<h2 id="section1">Section 1</h2>

<p>This is the first section of the document.</p>

<h2 id="section2">Section 2</h2>

<p>This is the second section of the document.</p>

</body>

</html>

Output :-
19. To write a program using IMG Source Tag in HTML
<html>

<head>

<title>Image Source Tag</title>

</head>

<body>

<h1>Image Displayed</h1>

<img src="https://www.mansory.com/sites/default/files/styles/1170_x_full_box_image/public/2023-
09/image00001.jpg?itok=A-FTMhY7"alt="any error" width="600" height="300">

</body>

</html>

Output :-

You might also like