Jump to content

Basic Guide to HTML

Neo

By Neo
in Off Topic

 Share

Recommended Posts

Neo

Neo

Posted
Posted

What is HTML?

HTML, which stands for Hyper Text Markup Language, is the predominant markup language for web pages. It provides a means to create structured documents by denoting structural semantics for text such as headings, paragraphs, lists etc as well as for links, quotes, and other items. It allows images and objects to be embedded and can be used to create interactive forms. It is written in the form of HTML elements consisting of "tags" surrounded by angle brackets within the web page content. It can include or can load scripts in languages such as JavaScript which affect the behavior of HTML processors like Web browsers; and Cascading Style Sheets (CSS) to define the appearance and layout of text and other material. The W3C, maintainer of both HTML and CSS standards, encourages the use of CSS over explicit presentational markup

The Basic Tags

Document Type <HTML></HTML> (beginning and end of file)

Title <TITLE></TITLE> (must be in header)

Header <HEAD></HEAD> (descriptive info, such as title)

Body <BODY></BODY> (bulk of the page)

Basic Structure

Heading <H?></H?> (the spec. defines 6 levels)

Align Heading <H? ALIGN=LEFT|CENTER|RIGHT></H?>

Division <DIV></DIV>

Align Division <DIV ALIGN=LEFT|RIGHT|CENTER|JUSTIFY></DIV>

Defined Content <SPAN></SPAN>

Block Quote <BLOCKQUOTE></BLOCKQUOTE> (usually indented)

Quote <Q></Q> (for short quotations)

Citation <Q CITE="URL"></Q>

Emphasis <EM></EM> (usually displayed as italic)

Strong Emphasis <STRONG></STRONG> (usually displayed as bold)

Citation <CITE></CITE> (usually italics)

Code <CODE></CODE> (for source code listings)

Basic Presentation

Bold <B></B>

Italic <I></I>

Underline <U></U> (not widely implemented)

Strikeout <STRIKE></STRIKE> (not widely implemented)

Strikeout <S></S> (not widely implemented)

Subscript <SUB></SUB>

Superscript <SUP></SUP>

Dividers

Paragraph <P></P> (closing tag often unnecessary)

Align Text <P ALIGN=LEFT|CENTER|RIGHT></P>

Justify Text <P ALIGN=JUSTIFY></P>

Line Break <BR> (a single carriage return)

Clear Textwrap <BR CLEAR=LEFT|RIGHT|ALL>

Horizontal Rule <HR>

Alignment <HR ALIGN=LEFT|RIGHT|CENTER>

Thickness <HR SIZE=?> (in pixels)

Width <HR WIDTH=?> (in pixels)

Width Percent <HR WIDTH="%"> (as a percentage of page width)

Solid Line <HR NOSHADE> (without the 3D cutout look)

No Break <NOBR></NOBR> (prevents line breaks)

Word Break <WBR> (where to break a line if needed)

Lists

Unordered List <UL><LI></UL> (before each list item)

Compact <UL COMPACT></UL>

Bullet Type <UL TYPE=DISC|CIRCLE|SQUARE> (for the whole list)

Bullet Type <LI TYPE=DISC|CIRCLE|SQUARE> (this & subsequent)

Ordered List <OL><LI></OL> (before each list item)

Compact <OL COMPACT></OL>

Numbering Type <OL TYPE=A|a|I|i|1> (for the whole list)

Numbering Type <LI TYPE=A|a|I|i|1> (this & subsequent)

Starting Number <OL START=?> (for the whole list)

Starting Number <LI VALUE=?> (this & subsequent)

Definition List <DL><DT><DD></DL> (<DT>Means the term, <DD>means the definition)

Compact <DL COMPACT></DL>

Menu List <MENU><LI></MENU> (before each list item)

Compact <MENU COMPACT></MENU>

Directory List <DIR><LI></DIR> (before each list item)

Compact <DIR COMPACT></DIR>

Positioning

Multi-Column <MULTICOL COLS=?></MULTICOL>

Column Gutter <MULTICOL GUTTER=?></MULTICOL>

Column Width <MULTICOL WIDTH=?></MULTICOL>

Spacer <SPACER>

Spacer Type <SPACER TYPE=HORIZONTAL|VERTICAL|BLOCK>

Size <SPACER SIZE=?>

Dimensions <SPACER WIDTH=? HEIGHT=?>

Alignment <SPACER ALIGN=LEFT|RIGHT|CENTER>

Layer <LAYER></LAYER>

Name <LAYER ID="***"></LAYER>

Location <LAYER LEFT=? TOP=?></LAYER>

Rel. Position <LAYER PAGEX=? PAGEY=?></LAYER>

Source File <LAYER SRC="***"></LAYER>

Stacking <LAYER Z-INDEX=?></LAYER>

Stack Position <LAYER ABOVE="***" BELOW="***"></LAYER>

Dimensions <LAYER HEIGHT=? WIDTH=?></LAYER>

Clipping Path <LAYER CLIP=,,,></LAYER>

Visible? <LAYER VISIBILITY=SHOW|HIDDEN|INHERIT></LAYER>

Background<LAYER BACKGROUND="$$$$$$"></LAYER>

Color <LAYER

Links and Graphics

Link Something <A HREF="URL"></A>

Link to Location <A HREF="URL#***"></A> (if in another document)

<A HREF="#***"></A> (if in current document)

Target Window <A HREF="URL" TARGET="***"></A>

Action on Click <A HREF="URL" ONCLICK="***"></A> (Javascript)

Mouseover Action <A HREF="URL" ONMOUSEOVER="***"></A> (Javascript)

Mouse out Action <A HREF="URL" ONMOUSEOUT="***"></A> (Javascript)

Link to Email <A HREF="mailto:@"></A>

Specify Subject <A HREF="mailto:@?SUBJECT=***"></A> (use a real question mark)

Define Location <A NAME="***"></A>

Display Image <IMG SRC="URL">

Alignment <IMG SRC="URL" ALIGN=TOP|BOTTOM|MIDDLE|LEFT|RIGHT>

Alignment <IMG SRC="URL" ALIGN=TEXTTOP|ABSMIDDLE|BASELINE|ABSBOTTOM>

Alternate <IMG SRC="URL" ALT="***"> (if image not displayed)

Dimensions <IMG SRC="URL" WIDTH=? HEIGHT=?> (in pixels)

<IMG SRC="URL" WIDTH=% HEIGHT=%> (as percentage of page width/height)

Border <IMG SRC="URL" BORDER=?> (in pixels)

Runaround Space <IMG SRC="URL" HSPACE=? VSPACE=?> (in pixels)

Low-Res Proxy <IMG SRC="URL" LOWSRC="URL">

Imagemap <IMG SRC="URL" ISMAP> (requires a script)

Imagemap <IMG SRC="URL" USEMAP="URL">

Movie Clip <IMG DYNSRC="***" START="***" LOOP=?>

Background Sound <BGSOUND SRC="***" LOOP=?|INFINITE>

Client-Side Map <MAP NAME="***"></MAP> (describes the map)

Map Section <AREA SHAPE="DEFAULT|RECT|CIRCLE|POLY" COORDS=",,," HREF="URL"|NOHREF>

Client Pull <META HTTP-EQUIV="Refresh" CONTENT="?; URL=URL">

Embed Object <EMBED SRC="URL"> (insert object into page)

Object Size <EMBED SRC="URL" WIDTH=? HEIGHT=?>

Object <OBJECT></OBJECT>

Scripts&Java

Script <SCRIPT></SCRIPT>

Location <SCRIPT SRC="URL"></SCRIPT>

Type <SCRIPT TYPE="***"></SCRIPT>

Language <SCRIPT LANGUAGE="***"></SCRIPT>

Other Content <NOSCRIPT></NOSCRIPT> (if scripts not supported)

Applet <APPLET></APPLET>

File Name <APPLET CODE="***">

Parameters <APPLET PARAM NAME="***">

Location <APPLET CODEBASE="URL">

Identifier <APPLET NAME="***"> (for references)

Alt Text <APPLET ALT="***"> (for non-Java browsers)

Alignment <APPLET ALIGN="LEFT|RIGHT|CENTER">

Size <APPLET WIDTH=? HEIGHT=?> (in pixels)

Spacing <APPLET HSPACE=? VSPACE=?> (in pixels)

Server Script <SERVER></SERVER>

Note: This guide is not finished, i just don't have the time to finish it now.

If you have any questions, just ask.

Credits

Me for writing this

BareBones for teaching me HTML Many years ago

CloneCharizard for pointing out some key tags.

I hope many people will use this when building their Websites

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing
×
×
  • Create New...