e
ut
it
st
In
"HTML Revision Sheet:
el
gh
Module 1 Essentials"
Ba
INDEX
[Link] revision sheet includes: 3
[Link] to Save a Notepad++ File as
an HTML File 4
e
[Link] HTML Code: 5
ut
<!-- Heading Tags --> 5
<!-- Paragraph with alignment --> 6
it
<!-- Formatting Tags -->
st 6
<!-- Preformatted Text --> 7
In
<!-- Image with attributes --> 7
<!-- Anchor Tag --> 8
<!-- Font Tag --> 8
el
gh
Ba
This revision sheet includes:
● How to Save a Notepad++ File as an HTML
File
● Basic heading tags (h1-h6)
e
ut
● Paragraphs with alignment options (left,
right, center, justify)
it
● Formatting tags (b, i, u, del, em, sup,
sub)
st
● Preformatted text (pre)
In
● Image tag with attributes (src, width,
height, alt, align)
el
● Anchor tag (a)
gh
● Font tag (color, face, size)
Ba
How to Save a Notepad++ File
as an HTML File
● Open Notepad++: Launch Notepad++ on your
computer.
e
● Write HTML Code: Type or paste your HTML
ut
code in the editor.
● Click on 'File': In the top-left menu, click on
it
the "File" option.
st
● Select 'Save As': From the dropdown, select
"Save As".
In
● Choose Save Location: Browse to the folder
where you want to save the file.
el
● Enter File Name: Type the desired file name
gh
with .html extension (e.g., [Link]).
● Select File Type: In the "Save as type"
Ba
dropdown, select All types.
● Click 'Save': Finally, click the "Save" button.
Write HTML Code:
<!DOCTYPE html>
<html>
e
<head>
ut
<title>HTML Revision Sheet</title>
</head>
it
<body>
st
In
<!-- Heading Tags -->
<h1>This is Heading 1</h1>
<h2>This is Heading 2</h2>
el
<h3>This is Heading 3</h3>
gh
<h4>This is Heading 4</h4>
<h5>This is Heading 5</h5>
Ba
<h6>This is Heading 6</h6>
<!-- Paragraph with alignment -->
<p align="left">This is a left-aligned
paragraph.</p>
<p align="right">This is a right-aligned
paragraph.</p>
e
<p align="center">This is a center-aligned
ut
paragraph.</p>
<p align="justify">This is a justified paragraph
it
that stretches across the page.</p>
st
<!-- Formatting Tags -->
In
<p><b>Bold Text</b></p>
<p><i>Italic Text</i></p>
el
<p><u>Underlined Text</u></p>
gh
<p><del>Deleted Text</del></p>
<p><em>Emphasized Text</em></p>
Ba
<p><sup>Superscript Text</sup></p>
<p><sub>Subscript Text</sub></p>
<!-- Preformatted Text -->
<pre>This is preformatted text.
It keeps the spaces
and line breaks as they are.</pre>
e
ut
<!-- Image with attributes -->
<img src="[Link]" width="300"
it
height="200" alt="Sample Image" align="left">
st
<img src="[Link]" width="300"
In
height="200" alt="Sample Image" align="right">
<img src="[Link]" width="300"
height="200" alt="Sample Image" align="top">
el
<img src="[Link]" width="300"
gh
height="200" alt="Sample Image" align="middle">
<img src="[Link]" width="300"
Ba
height="200" alt="Sample Image" align="bottom">
<!-- Anchor Tag -->
<a href="[Link]
here to visit [Link]</a>
<!-- Font Tag -->
e
<font color="blue" face="Arial"
ut
size="4">This is text with a font tag
applied.</font>
it
</body>
st
In
</html>
el
gh
Ba
