HTML Overview

An HTML Overview

(-: Enjoy! :-)

Text Output Basics

(Refer to code for syntax)

This is a plain paragraph.

This is before a line break ...

And this is after a line break.

For this next section, note that "Plain|" is used as a point of comparison. Also note that the phrase that is wrapped in quotation marks is the name of the text formatting tag.

Plain|This is "strong".

Plain|This is "b".

Plain|This is "i".

Plain|This is "em".

Plain|This is "big".

Plain|This is "small".

Plain|~~This is "strike"~~.

Plain|~~This is "del"~~.

Plain|^{This is "sup"}.

Plain|_{This is "sub"}.

Plain|This is "ins".

Plain|This is "u".

Useful Acronyms

HTML => HyperText Markup Language

CSS => Cascading Style Sheet

Useful Tags

a => Anchor

div => DIVide

em = EMphasized (italicized) text

href => Hypertext REFerence

img => IMaGe

li => List Item

ol => Ordered List

pre => PREformatted text

rel => RELation

tb => Table Body

td => Table Data

tf => Table Footer

th => Table Header

tr => Table Row

Useful Hyperlinks

SoloLearn Homepage

An Ordered List (<ol></ol>)

This is "li" #1.
This is "li" #2.
This is "li" #3.

An Unordered List (<ul></ul>)

This is "li" #1.
This is "li" #2.
This is "li" #3.

Variations of Lists

Ordered List, type="A":

This is "li" #1.
This is "li" #2.
This is "li" #3.

Ordered List, type="a":

This is "li" #1.
This is "li" #2.
This is "li" #3.

Ordered List, type="I":

This is "li" #1.
This is "li" #2.
This is "li" #3.

Ordered List, type="i":

This is "li" #1.
This is "li" #2.
This is "li" #3.

Unordered List, type="square":

This is "li" #1.
This is "li" #2.
This is "li" #3.

Unordered List, type="circle":

This is "li" #1.
This is "li" #2.
This is "li" #3.

Unordered List, type="disc":

This is "li" #1.
This is "li" #2.
This is "li" #3.

Tables

A centered "table" with 3 "tr" tags
"th" 1	"th" 2	"th" 3
"td" col 1	"td" col 2 "rowspan=2"	"td" col 3
"td" col 1	"td" col 2 "rowspan=2"	"td" col 3
"td" with "colspan=3"

Div vs Span

A div is used to alter an entire block-level section of elements.

A span is used to alter a specific inline-level element.

Div Example:

Block item 1
Block item 2
Block item 3

Span Example:

Plain item 1
Span-altered item 2
Plain item 3

Types of Elements

Some elements can be used as either block-level elements or as inline elements.
This includes the following elements:

APPLET - Embedded Java applet
IFRAME - Inline Frame
INS - Inserted Text
MAP - Image Map
OBJECT - embedded object
SCRIPT - Script within an HTML document

Forms

Google Search iFrame