Scribd
Upload
28 views4 pages

CheatSheet 1

The document provides descriptions and examples of common HTML elements including <!DOCTYPE html>, <html>, <head>, <body>, <div>, <h1>, <img>, <a>, <ul>, <ol>, <li>, <p>, and <script>. It explains what each element is used for and how to properly structure an HTML document using the described tags.

Uploaded by

gogem86902
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
28 views4 pages

CheatSheet 1

The document provides descriptions and examples of common HTML elements including <!DOCTYPE html>, <html>, <head>, <body>, <div>, <h1>, <img>, <a>, <ul>, <ol>, <li>, <p>, and <script>. It explains what each element is used for and how to properly structure an HTML document using the described tags.

Uploaded by

gogem86902
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/15/24, 9:28 AM about:blank

Module 2 Cheatsheet: HTML5 Overview


Element Description Example
This tag
denotes a
comment in
HTML, which 1. 1
is not
<!-- --> displayed by a 1. <!-- This is a comment -->
browser but
Copied!
can be useful
to hide and
document
code.
1. 1
2. 2
3. 3
4. 4
All HTML
5. 5
documents 6. 6
must start with 7. 7
this 8. 8
declaration. It 9. 9
<!DOCTYPE tells the 1. <!DOCTYPE html>
html> browser what 2. <html>
document type 3. <head>
to expect. 4. <!-- Metadata Here -->
Note that this 5. </head>
6. <body>
element has no 7. <!-- Document Body Here -->
ending tag. 8. </body>
9. </html>

Copied!
This tag,
called an
“anchor tag”
creates
hyperlinks 1. 1
<a href= using the href
“path”>link attribute. In 1. <a href="https://www.ibm.com">IBM</a>
name</a> place of path
Copied!
enter the URL
or path name
to the page
you want to
link to.
1. 1
2. 2
3. 3
4. 4
Contains the 5. 5
contents of the 6. 6
HTML 7. 7
document. It 8. 8
should contain 9. 9
all other tags 1. <!DOCTYPE html>
<body>
besides the 2. <html>
<head> 3. <head>
element to 4. <!-- Metadata Here -->
display the 5. </head>
6. <body>
body of the 7. <!-- Document Body Here -->
document. 8. </body>
9. </html>

Copied!
Often used to 1. 1
separate 2. 2
sections in the 3. 3
body of a 1. <div>
<div>
document in 2. This element has no particular semantic meaning but is often used in conjunction with CSS for styling purposes.
order to style 3. </div>
that content
with CSS. Copied!

Adds a level 1 1. 1
heading to the 1. <h1>Thomas J. Watson</h1>
<h1>
HTML
document. Copied!

about:blank 1/4
1/15/24, 9:28 AM about:blank
1. 1
2. 2
3. 3
4. 4
5. 5
6. 6
7. 7
Contains 8. 8
metadata and 9. 9
should be
<head> placed after 1. <!DOCTYPE html>
2. <html>
the <html> tag 3. <head>
and before the 4. <!-- Metadata Here -->
<body> tag. 5. </head>
6. <body>
7. <!-- Document Body Here -->
8. </body>
9. </html>

Copied!
1. 1
2. 2
3. 3
4. 4
5. 5
The root 6. 6
7. 7
element of an 8. 8
HTML 9. 9
document. All
<html> other tags in 1. <!DOCTYPE html>
2. <html>
the document 3. <head>
should be 4. <!-- Metadata Here -->
contained in 5. </head>
this tag. 6. <body>
7. <!-- Document Body Here -->
8. </body>
9. </html>

Copied!
This tag is
used to place
an img. In
place of path
insert a URL
or a relative 1. 1
<img
file path to the
src=“path” 1. <img src=“https://upload.wikimedia.org/wikipedia/commons/7/7e/Thomas_J_Watson_Sr.jpg” width=“300” height=“300”/>
image
width=“dim1”
location. Other
height=“dim2”> Copied!
optional
attributes
include width
and height of
the image in
pixels.
Element that
creates 1. 1
2. 2
bulleted line 3. 3
items in an 4. 4
ordered or
<li> unordered 1. <ul>
list. Should be 2. <l1>Bullet point 1<l1>
3. <l1>Bullet point 2<l1>
used in 4. </ul>
conjunction
with the <ul> Copied!
or <ol> tags.
1. 1
Used to link 2. 2
an external 3. 3
document,
<link> such as a CSS 1. <head>
2. <link rel=“stylesheet” href=“styles.css”>
file, to an
3. </head>
HTML
document. Copied!
1. 1
Used to 2. 2
provide 3. 3
metadata 1. <head>
<meta>
about the 2. <meta name=“author” content=“Christopher Moore”>
HTML 3. </head>
document.
Copied!
<ol> Element that 1. 1
creates an 2. 2
3. 3
ordered list 4. 4

about:blank 2/4
1/15/24, 9:28 AM about:blank
using 1. <ol>
numbers. 2. <li>Numbered bullet point 1<li>
3. <li>Numbered bullet point 2<li>
Should be 4. </ol>
used in
conjunction Copied!
with the <li>
tag.
This tag is
used to
identify a 1. 1
paragraph. It 1. <p>This is a paragraph of text. It can be as short or as long as needed.</p>
<p>
places a line
break after the Copied!
text it is
enclosed in.
1. 1
2. 2
Used to embed 3. 3
JavaScript in 1. <script>
<script>
an HTML 2. alert(“Hello World”);
document. 3. </script>

Copied!
1. 1
2. 2
3. 3
4. 4
5. 5
6. 6
7. 7
8. 8
9. 9
This tag is 10. 10
11. 11
used to denote 12. 12
a table. Should 13. 13
be used with 14. 14
<tr> (defines a 15. 15
table row) and 16. 16
<td> (defines 1. <table>
<table>
a table cell 2. <tr>
within a row) 3. <th>Header cell 1</th>
tags. The <th> 4. <th>Header cell 2</th>
5. </tr>
tag can also be
6. <tr>
used to define 7. <td>First row first cell</td>
the table 8. <td>First row second cell</td>
header row. 9. </tr>
10. <tr>
11. <td>Second row first cell</td>
12. <td>Second row second cell</td>
13. </tr>
14. </table>
15.
16. </td>

Copied!
1. 1
Denotes a cell
<td> within a row, 1. <td>Cell Content</td>
within a table.
Copied!
<th> Denotes the 1. 1
header cells 2. 2
3. 3
within a row 4. 4
within a table. 5. 5
6. 6
7. 7
8. 8
9. 9
10. 10
11. 11
12. 12
13. 13
14. 14

1. <table>
2. <tr>
3. <th>Header cell 1</th>
4. <th>Header cell 2</th>
5. </tr>
6. <tr>
7. <td>First row first cell</td>
8. <td>First row second cell</td>
9. </tr>
10. <tr>
11. <td>Second row first cell</td>
12. <td>Second row second cell</td>
13. </tr>
14. </table>

about:blank 3/4
1/15/24, 9:28 AM about:blank
Copied!

1. 1
2. 2
Defines the 3. 3
title of the 4. 4
HTML 5. 5
document 6. 6
7. 7
displayed in 8. 8
the browser’s 9. 9
title bar and
<title> tabs. It is 1. <!DOCTYPE html>
2. <html>
required in all
3. <head>
HTML 4. <title>Document Title</title>
documents. It 5. </head>
should be 6. <body>
contained in 7. <!-- Document Body Here -->
8. </body>
the <head> 9. </html>
tag.
Copied!
1. 1
2. 2
3. 3
4. 4
5. 5
6. 6
7. 7
8. 8
9. 9
10. 10
11. 11
12. 12
13. 13
14. 14
Denotes a row 1. <table>
<tr>
within a table. 2. <tr>
3. <th>Header cell 1</th>
4. <th>Header cell 2</th>
5. </tr>
6. <tr>
7. <td>First row first cell</td>
8. <td>First row second cell</td>
9. </tr>
10. <tr>
11. <td>Second row first cell</td>
12. <td>Second row second cell</td>
13. </tr>
14. </table>

Copied!

Element that 1. 1
2. 2
creates an 3. 3
unordered list 4. 4
using
<ul> bullets. Should 1. <ul>
2. <li>Bullet point 1<li>
be used in
3. <li>Bullet point 2<li>
conjunction 4. </ul>
with the
tag. Copied!

Changelog
Date Version Changed by Change Description
18-10-2022 1.0 Michelle Saltoun Initial version created
20-03-2023 1.1 Sneha R Baddi Instructions Updated

© IBM Corporation 2022. All rights reserved.

about:blank 4/4

You might also like