0% found this document useful (0 votes)
3 views4 pages

HTML Programs 1 To 12

The document contains a series of HTML examples demonstrating various elements and attributes, including headings, paragraphs, line breaks, centering content, horizontal lines, preserving formatting, alignment, styling, text formatting, and image insertion. Each example is structured with a DOCTYPE declaration, head, and body sections. The document serves as a practical guide for understanding basic HTML structure and formatting techniques.

Uploaded by

itigform
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
0% found this document useful (0 votes)
3 views4 pages

HTML Programs 1 To 12

The document contains a series of HTML examples demonstrating various elements and attributes, including headings, paragraphs, line breaks, centering content, horizontal lines, preserving formatting, alignment, styling, text formatting, and image insertion. Each example is structured with a DOCTYPE declaration, head, and body sections. The document serves as a practical guide for understanding basic HTML structure and formatting techniques.

Uploaded by

itigform
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/ 4

1.

Hallo World
<!--1. Hallo World-->

<!DOCTYPE html>
<html>
<head>
<title>Hallo World</title>
</head>
<body>
<p>Hallo World</p>

</body>
</html>
=============================================

2. Page Title & Heading Types


<!--2. Page Title & Heading Types-->

<!DOCTYPE html>
<html>
<head>
<title>Page Title & Heading Types</title>
</head>
<body>
<h1>This is heading 1</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</h6>

</body>
</html>

======================================================
3.Example of Paragraphs
<!--3.Example of Paragraphs-->

<!DOCTYPE html>
<html>

<head>
<title>Paragraph Example</title>
</head>

<body>
<p>Here is a first paragraph of text.</p>
<p>Here is a second paragraph of text.</p>
<p>Here is a third paragraph of text.</p>
</body>

</html>

=====================================================
4.Example of Line Break
<!--4.Example of Line Break-->

<!DOCTYPE html>
<html>

<head>
<title>Line Break Example</title>
</head>

<body>
<p>Hello<br />
You delivered your assignment ontime.<br />
Thanks<br />
Mahnaz</p>
</body>

</html>
====================================================
5.Example of Centring Content

<!--5.Example of Centring Content-->

<!DOCTYPE html>
<html>

<head>
<title>Centring Content Example</title>
</head>

<body>
<p>This text is not in the center.</p>

<center>
<p>This text is in the center.</p>
</center>
</body>

</html>
========================================================
6.Example of Horizontal Line
<!--6.Example of Horizontal Line-->

<!DOCTYPE html>
<html>

<head>
<title>Horizontal Line Example</title>
</head>
<body>
<p>This is paragraph one and should be on top</p>
<hr />
<p>This is paragraph two and should be at bottom</p>
</body>

</html>
=======================================================
7.Example of Preserve Formatting
<!--7.Example of Preserve Formatting-->
<!DOCTYPE html>
<html>

<head>
<title>Preserve Formatting Example</title>
</head>

<body>
<pre>
function testFunction( strText ){
alert (strText)
}
</pre>
</body>

</html>

=========================================================

8.Example of Align Attribute

<!--8.Example of Align Attribute-->

<!DOCTYPE html>
<html>

<head>
<title>Align Attribute Example</title>
</head>

<body>
<p align = "left">This is left aligned</p>
<p align = "center">This is center aligned</p>
<p align = "right">This is right aligned</p>
</body>

</html>
================================================================
9.Example of Style Attribute
<!--9.Example of Style Attribute-->

<!DOCTYPE html>
<html>
<title>Style Attribute</title>
<body>

<body style="background-color:powderblue;">
<p>I am normal</p>
<p style="color:red;">I am red</p>
<p style="color:blue;">I am blue</p>
<p style="font-size:36px;">I am big</p>

</body>
</html>
===============================================================
10.Example of Text Formatting

<!--10.Example of Text Formatting-->

<!DOCTYPE html>
<html>

<head>
<title>Bold Text Example</title>
</head>

<body>
<p>The following word uses a <b>bold</b> typeface.</p>

<p>The following word uses an <i>italicized</i> typeface.</p>

<p>The following word uses an <u>underlined</u> typeface.</p>

<p>The following word uses a <strike>strikethrough</strike> typeface.</p>

<p>The following word uses a <sup>superscript</sup> typeface.</p>

<p>The following word uses a <sub>subscript</sub> typeface.</p>

</body>
</html>
=====================================================================
11.Example of Insert Image File
<!--11.Example of Insert Image File-->

<!DOCTYPE html>
<html>

<head>
<title>Using Image in Webpage</title>
</head>

<body>
<p>Simple Image Insert</p>
<img src = "/html/images/test.png" alt = "Test Image" />
</body>

</html>
==============================================================
12.Example of Set Image Width/Height
<!--12.Example of Set Image Width/Height-->

<!DOCTYPE html>
<html>
<head>
<title>Set Image Width and Height</title>
</head>
<body>
<p>Setting image width and height</p>
<img src = "/html/images/test.png" alt = "Test Image" width = "150" height = "100"/>
</body>
</html>
====================================================================

You might also like