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

II HTML5 Colors

The document provides an overview of HTML 5, covering essential elements such as headings, paragraphs, styles, and colors. It emphasizes the importance of headings for document structure and search engine indexing, as well as the use of CSS for styling HTML elements. Additionally, it discusses various HTML tags and their functionalities, including metadata in the <head> element and formatting options for text.

Uploaded by

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

II HTML5 Colors

The document provides an overview of HTML 5, covering essential elements such as headings, paragraphs, styles, and colors. It emphasizes the importance of headings for document structure and search engine indexing, as well as the use of CSS for styling HTML elements. Additionally, it discusses various HTML tags and their functionalities, including metadata in the <head> element and formatting options for text.

Uploaded by

reyesc1516
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 31

HTML 5

HTML 5

Headings Quotations
Paragraphs Comments
Styles Colors
Formatting CSS
Headings Are Important
HTML Headings Search engines use the headings
to index the structure and content
of your web pages.

Users skim your pages by its


headings. It is important to use
headings to show the document
structure.

<h1> headings should be used for


main headings, followed by <h2>
headings, then the less important
<h3>, and so on.

Each HTML heading has a default size. However, you can


specify the size for any heading with the style attribute,
using the CSS font-size property:
HTML Horizontal Rules

The <hr> tag defines a thematic


break in an HTML page, and is
most often displayed as a
horizontal rule.

The <hr> element is used to


separate content (or define a
change) in an HTML page:
The HTML <head> Element

The HTML <head> element has nothing


to do with HTML headings.

The <head> element is a container for


metadata. HTML metadata is data
about the HTML document. Metadata
is not displayed.

The <head> element is placed


between the <html> tag and the
<body> tag:
View HTML Source Code:
Right-click in an HTML page
and select "View Page Source"
(in Chrome) or "View Source"
(in IE), or similar in other
browsers. This will open a
window containing the HTML
source code of the page.

Inspect an HTML Element:


Right-click on an element (or a blank area),
and choose "Inspect" or "Inspect Element" to
see what elements are made up of (you will
see both the HTML and the CSS). You can
also edit the HTML or CSS on-the-fly in the
Elements or Styles panel that opens.
HTML Tag Reference

https://www.w3schools.com/tags/default.asp
HTML Paragraphs
The HTML <p> element defines a paragraph:

HTML Display
You cannot be sure how HTML will be displayed.
Large or small screens, and resized windows will
create different results.
With HTML, you cannot change the output by
adding extra spaces or extra lines in your HTML
code.
The browser will remove any extra spaces and
extra lines when the page is displayed:
HTML Line Breaks

The HTML <br> element defines a line break.

Use <br> if you want a line break (a new line) without


starting a new paragraph:

The <br> tag is an empty tag, which means that it


has no end tag.
The HTML <pre> Element

The HTML <pre> element


defines preformatted text.

The text inside a <pre>


element is displayed in a
fixed-width font (usually
Courier), and it preserves
both spaces and line breaks:
HTML Styles
The HTML Style Attribute
Setting the style of an HTML element, can be done with the style attribute.

The property is a CSS property. The value is a CSS value.


HTML Background Color
The background-color property defines the background color for an HTML element.
HTML Text Color
The color property defines the text color for an HTML element:
HTML Fonts
The font-family property defines the font to be used for an
HTML element:

HTML Text
Alignment
The text-align property defines the
horizontal text alignment for an

HTML Text Size HTML element:

The font-size property defines the text size for an HTML element:
HTML Text Formatting
HTML Formatting Elements

 HTML also defines special elements for


defining text with a special meaning.
 HTML uses elements like <b> and <i>
for formatting output, like bold or italic
text.
 Formatting elements were designed
to display special types of text:
HTML Quotation and Citation Elements
HTML <q> & <blockquote> for Quotations
HTML Quotation and Citation Elements
HTML Comment Tags
HTML Colors
HTML colors are specified using predefined color names,
or RGB, HEX, HSL, RGBA, HSLA values.

https://www.w3schools.com/colors/colors_names.asp
Background Color
Text Color
Border Color
Color Values
In HTML, colors can also be specified using RGB values,
HEX values, HSL values, RGBA values, and HSLA values:
Color Names Supported by All Browsers

https://www.w3schools.com/colors/colors_hex.asp
Chapter Summary

• Use the style attribute for styling HTML elements


• Use background-color for background color
• Use color for text colors
• Use font-family for text fonts
• Use font-size for text sizes
• Use text-align for text alignment

You might also like