Scribd
Upload
10 views

HTML Notes

Cat grade 12 html tag summary notes

Uploaded by

joshuameyer066
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
10 views

HTML Notes

Cat grade 12 html tag summary notes

Uploaded by

joshuameyer066
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

Setting Up a New Page:

To create an HTML page, all you need is a simple text editor like Notepad (Windows) or TextEdit (Mac).
Open your text editor, and save your file with a .html extension. This tells the computer that it's an
HTML file.

Document Structure:

Every HTML page begins with a document type declaration and an <html> tag. Inside the <html> tag,
there are two main sections: <head> and <body>. The <head> section contains meta-information about
the page, while the <body> section holds the visible content.

html

<!DOCTYPE html>

<html>

<head>

<title>My Webpage</title>

</head>

<body>

<!-- Your content goes here -->

</body>

</html>

Adding Headings:

Headings help to structure your content. There are six levels of headings, from <h1> (the main heading)
to <h6> (the smallest subheading).

html

<h1>This is the Main Heading</h1>

<h2>This is a Subheading</h2>

<!-- ...and so on up to h6 -->


Creating Paragraphs:

To write regular text, you simply use <p> tags for paragraphs.

html

<p>This is a paragraph. It's like talking to your visitors.</p>

Inserting Images:

You can add images using the <img> tag. Remember to provide the src attribute with the image file's
location.

html

<img src="image.jpg" alt="Description of the image">

Creating Links:

Hyperlinks connect different web pages. Use the <a> tag with the href attribute to specify the link's URL.

html

<a href="https://www.example.com">Click me to visit Example.com!</a>

Making Lists:

Lists organize information in an ordered or unordered format. Use <ul> for unordered lists and <ol> for
ordered lists, with <li> for each list item.

html

<ul>

<li>Item 1</li>

<li>Item 2</li>

</ul>

<ol>

<li>First</li>

<li>Second</li>

</ol>
Using Tables:

Tables help you display data in rows and columns. Use <table> to create the table, <tr> for table rows,
and <td> for table cells (data).

html

<table>

<tr>

<td>Row 1, Cell 1</td>

<td>Row 1, Cell 2</td>

</tr>

<tr>

<td>Row 2, Cell 1</td>

<td>Row 2, Cell 2</td>

</tr>

</table>

Remember to close all tags you open. For example, <p> needs a </p> to close it. Also, make sure to
practice and experiment with these elements to become more comfortable with HTML.

Formatting:

HTML allows you to control how your text appears on the webpage. You can use the following tags for
basic text formatting:

<strong>: Makes text bold.

<em>: Italicizes text.

<u>: Underlines text.

<del>: Represents deleted text (strikethrough).

<ins>: Represents inserted text (underlined by default).

<mark>: Highlights text with a yellow background.

<sub>: Subscripts the text (appears below the baseline).

<sup>: Superscripts the text (appears above the baseline).


Font:

While it's not recommended to use the <font> tag for modern web development, you can use it
to set the font, size, and color of your text.

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

Text:

HTML provides some additional text-related tags for specific purposes:

<abbr>: Defines an abbreviation or acronym.

<blockquote>: Represents a long quotation.

<code>: Represents computer code.

<kbd>: Represents keyboard input.

<p><abbr title="Computer Applications Technology">CAT</abbr> is an exciting subject


for learners.</p>

<blockquote>

<p>"The only way to do great work is to love what you do." - Steve Jobs</p>

</blockquote>

<p>If you want to display a code snippet, use the <code>&lt;html&gt;</code> tag.</p>

<p>To save your work, press <kbd>Ctrl + S</kbd>.</p>

Graphics:

HTML allows you to add images to your webpage using the <img> tag.

<img src="path/to/your/image.jpg" alt="Description of the image">

You might also like