0% found this document useful (0 votes)
40 views

Introduction To HTML

The document provides an introduction to HTML formatting tags. It defines HTML and some common tags such as <p>, <br>, <b>, and <i>. It explains that HTML tags normally come in pairs and provides examples of opening and closing tags. The document also discusses the difference between HTML documents and documents created in a word processor, and how HTML uses tags to define formatting rather than menus and buttons.

Uploaded by

Kiana Carlyn
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
40 views

Introduction To HTML

The document provides an introduction to HTML formatting tags. It defines HTML and some common tags such as <p>, <br>, <b>, and <i>. It explains that HTML tags normally come in pairs and provides examples of opening and closing tags. The document also discusses the difference between HTML documents and documents created in a word processor, and how HTML uses tags to define formatting rather than menus and buttons.

Uploaded by

Kiana Carlyn
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 63

Introduction

to HTML
BASIC
Objectives

 Define HTML
 Identify the different tags in
HTML
 Discussthe uses of the
different tags
Essential Question

How do HTML documents


differ from documents
created with a word
processor such as Word?
HTML
HTML

 HyperText Markup Language


 TheLanguage of Web Pages on
the World Wide Web
 HTML is a text formatting
language.
 HTML elements are
represented by tags
HTML Tags
 building blocks of HTML pages
 HTML tags are element names surrounded
by angle brackets:
<tagname>content goes here...</tagname>
 HTML tags normally come in pairs like <p> and
</p>
 The first tag in a pair is the start tag, the second
tag is the end tag
 The end tag is written like the start tag, but
with a forward slash inserted before the tag
name
!DOCTYPE TAG
 The <!DOCTYPE> Declaration
 The <!DOCTYPE> declaration represents the
document type, and helps browsers to display web
pages correctly.
 It must only appear once, at the top of the page
(before any HTML tags).
 The <!DOCTYPE> declaration is not case sensitive.
 The <!DOCTYPE> declaration for HTML5 is:

<!DOCTYPE html>
HTML Tag

The <html> element is


the root element of an
HTML page
</html> ending tag
Head Tag

The <head> element


contains meta
information about the
document
</head> ending tag
Title Tag

The <title> element


specifies a title for the
document
</title> ending tag
Body Tag

The <body> element


contains the visible page
content
</body> ending tag
Notepad++
 isa text editor and source
code editor for use with
Microsoft Windows.
Hello World!
<hr> Tag

represents a
horizontal rule
<center> tag

Alignsthe text and


images to the center
<br> tag

produces a line break in


text
Use <br> if you want a
line break (a new line)
without starting a new
paragraph:
Activity
Practicum 1
Format Tags
LIFE 1. Type the content in
Notepad++
Life is an opportunity;
2. Center aligns all content.
Life is beauty;
3. Put horizontal line
Life is a dream;
after the title.
Life is a challenge;
4. Use heading 1 for the title
Life is a duty; and first two lines of the
Life is a game; poem.

Life is a promise; 5. Apply heading 2 for lines 3


and 4.
Life is sorrow;
6. Use heading 3 for lines 5
Life is a song; and 6.
Life is a struggle; 7. Apply heading 4 for lines 7
Life is a tragedy; to 9.

Life is an adventure; 8. Use heading 5 for lines 10


to 12.
Life is luck;
9. Apply heading 6 for lines
Life is too precious; 13 to 15.
Life is life, fight for it.
HTML
Formatting
Tags
Objectives

 Define STYLE attributes


 Discuss the difference
between TAG and Attribute
 Identify the formatting syntax
for STYLE attribute
 Enumerate the different
formatting attributes
Essential Question

How do HTML documents


differ from documents
created with a word
processor such as Word?
Background Color
Style Attribute
Style Attribute
 AnHTML attribute is a modifier of an
HTML element type.
 In HTML syntax, an attribute is added
to an HTML start tag.
 The HTML style attribute has the
following syntax:
<tagname style="property:value;">
Differences of TAGS and
ATTRIBUTES

 Tags are used to mark up the


start and end of an HTML
element.
 Anattribute defines a property
for an element, consists of an
attribute/value pair, and
appears within the element's
start tag
Font Attribute
 The font-family property defines
the font to be used for an HTML
element:
HTML Text Size

 The font-size property defines the


text size for an HTML element:
HTML Text Alignment

 The text-align property defines the


horizontal text alignment for an
HTML element:
HTML Background Color
 The background-color property
defines the background color for an
HTML element.
 This example sets the background
color for a page to powderblue:
HTML Text Color

 the color property defines the text


color for an HTML element:
PRACTICUM 2

You might also like