Created by Turbolearn AI
Introduction to HTML5
HTML5 is the latest version of the Hypertext
Markup Language, which is the standard language
for creating and designing webpages and
applications. It introduces new features and
improvements that enhance the structure,
functionality, and user experience of websites. Some
of the key features of HTML5 include:
Simplified Syntax
Cross-platform compatibility
Rich Media Support
What is HTML?
HTML is a standard markup language used to
create web pages. It stands for HyperText
Markup Language.
Hypertext: Text that you click to jump from document to document.
This is a reference to the ability of web pages to link to one another.
Markup: Tags that apply layout and formatting conventions to plain
text. Literally, the plain text is marked up with the tags.
Language: A reference to the fact that HTML is considered a
programming language.
Specifying the Document Type
Page 1
Created by Turbolearn AI
The <!DOCTYPE> declaration defines the document
type and version of HTML being used. For HTML5,
the declaration is , indicating modern web
standards. This declaration must appear at the very
beginning of the HTML document, before the tag.
HTML Tags
HTML tags are used to structure and format content
on a webpage. They define elements like headings,
paragraphs, links, images, and more. HTML is a tag-
based language that uses tags and attributes. The
first tag in a pair is the opening tag, and the second
tag is the closing tag. There are some tags that are
exceptions, where a closing tag is not required, such
as the tag.
Structure of an HTML Document
The basic structure of an HTML document includes:
<!DOCTYPE> declaration
tag
tag
tag
Creating a HTML File
Page 2
Created by Turbolearn AI
To create a HTML file, follow these steps:
1. Open a text editor or code editor.
2. Write the HTML structure.
3. Save the file with a .html extension.
4. Open the file in a web browser.
HTML Text Formatting Tags
The following are some common HTML text
formatting tags:
Tag Description
Makes text bold
Indicates strong importance (bold text)
Makes text italic
Emphasizes text (italic text)
Highlights text with a background color
Displays text in a smaller font size
Defines a paragraph
Defines a line break
Defines underlined text
or Defines strike-through text
Displays text as subscript
Displays text as superscript
HTML Heading Tags
The following are the different HTML heading tags:
Page 3
Created by Turbolearn AI
Tag Description
Represents the main heading or title of the webpage
Represents subheadings or sections under
Useful for breaking content into smaller parts
Typically used for more detailed subsections
Less commonly used but available for deep hierarchies
Used for minor details or deep subcategories
HTML List Elements
A list is a sequence of paragraphs, each of which is
preceded by a special symbol or a sequence of
numbers. The following are the different types of
HTML list elements:
Page 4
Created by Turbolearn AI
Ordered List (
Page 5
Created by Turbolearn AI
): Displays items in a sequential order (numbered)
1. Unordered List (
): Displays items in no particular order (bulleted)
Definition List (
): Used to create a list of terms and their descriptions
Inserting Special Characters
Special characters are characters that are not
included on a standard English keyboard. In
HTML, these are referred to as entities and
are created using codes beginning with an
ampersand (&) followed by an entity name or
entity number and ending with a semicolon
(;).
Inserting Horizontal Lines
The
tag is used to insert horizontal lines in the HTML document to separate
sections of the document. It is an empty or unpaired tag, meaning there is
no need for a closing tag.
Choosing Background and Foreground
Colors
Page 6
Created by Turbolearn AI
The CSS background-color property defines
the background color for an HTML element.
The foreground color in HTML usually refers
to the text color of an element, which is
specified using the color property in CSS.
Creating Hyperlinks and
Anchors/Bookmarks
A hyperlink, or simply a link, is a reference to
a resource that allows users to navigate from
one page or document to another, typically
through clicking on text, images, or buttons.
The basic syntax for creating hyperlinks is:
<a href="URL">Link Text</a>
The tag is used to define a hyperlink in
HTML. The href attribute specifies the URL or
destination of the link, and the Link Text is
the clickable text that the user will see.
Types of Linking
There are three types of linking:
Page 7
Created by Turbolearn AI
Internal Linking: Refers to links that point to other pages or sections
within the same website or domain.
External Linking: Refers to links that point to a resource or page on
a different website, typically outside of the current domain.
Hyperlink to an Email Address: Used to create a hyperlink to an
email address in HTML, using the mailto: protocol.
Introduction to CSS
Cascading Style Sheets (CSS) is a simple
design language intended to simplify the
process of making web pages presentable.
CSS is a code that specifies formatting based
on styles and handles the look and feel part
of a web page.
Advantages of CSS
The advantages of using CSS include:
Saves time
Pages load faster
Easy maintenance
Superior styles to HTML
Multiple device compatibility
Global web standards
Understanding Styles
Page 8
Created by Turbolearn AI
A style is a formatting rule that can be
applied to an individual tag or to all instances
of a certain tag within a document. To create
a global style rule for all tags in the
document, a
Page 9