Issuu on Google+

HTML TAGS o

basic elements (all HTML documents should have these)

o

structural definition (appearance controlled by the browser's preferences)

o

presentation formatting (author specifies text appearance)

o

links, graphics, and sounds

o

positioning

o

dividers

o

lists

o

backgrounds and colors

o

special characters

o

forms

o

tables

o

frames

o

scripts and java

o

miscellaneous

BASIC ELEMENTS Document Type Title Header Body

<HTML></HTML> <TITLE></TITLE> <HEAD></HEAD> <BODY></BODY>

(beginning and end of file) (must be in header) (descriptive info, such as title) (bulk of the page)

STRUCTURAL DEFINITION <H?></H?> (the spec. defines 6 levels) <H? Align Heading ALIGN=LEFT|CENTER|RIGHT></H?> <DIV></DIV> Division <DIV ALIGN=LEFT|RIGHT|CENTER|JUSTIFY></DIV> Align Division Defined Content <SPAN></SPAN> <BLOCKQUOTE></BLOCKQUOTE> (usually indented) Block Quote <Q></Q> (for short quotations) Quote <Q CITE="URL"></Q> Citation <EM></EM> (usually displayed as italic) Emphasis

Heading

4.0 4.0 4.0

No license: PDF produced by PStill (c) F. Siegert - http://www.this.net/~frank/pstill.html


Strong Emphasis Citation Code Sample Output Keyboard Input Variable Definition Author's Address Large Font Size Small Font Size

<STRONG></STRONG> <CITE></CITE> <CODE></CODE> <SAMP></SAMP> <KBD></KBD> <VAR></VAR> <DFN></DFN>

4.0

Insert

<INS></INS>

4.0 4.0

Time of Change <INS DATETIME=":::"></INS> <INS CITE="URL"></INS> Comments

4.0

Delete

<DEL></DEL>

4.0 4.0 4.0 4.0

Time of Change Comments Acronym Abbreviation

<DEL DATETIME=":::"></DEL> <DEL CITE="URL"></DEL> <ACRONYM></ACRONYM> <ABBR></ABBR>

(usually displayed as bold) (usually italics) (for source code listings)

(not widely implemented)

<ADDRESS></ADDRESS> <BIG></BIG> <SMALL></SMALL>

(marks additions in a new version)

(marks deletions in a new version)

PRESENTATION FORMATTING <B></B> Bold <I></I> Italic <U></U> 4.0* Underline <STRIKE></STRIKE> Strikeout <S></S> 4.0* Strikeout <SUB></SUB> Subscript <SUP></SUP> Superscript <TT></TT> Typewriter <PRE></PRE> Preformatted <PRE WIDTH=?></PRE> Width <CENTER></CENTER> Center <BLINK></BLINK> N1 Blinking <FONT SIZE=?></FONT> Font Size Change Font Size <FONT SIZE="+|-?"></FONT>

Font Color 4.0* N4 N4 4.0* MS

Select Font Point size Weight Base Font Size Marquee

(not widely implemented) (not widely implemented) (not widely implemented)

(displays in a monospaced font) (display text spacing as-is) (in characters) (for both text and images) (the most derided tag ever) (ranges from 1-7)

<FONT COLOR="#$$$$$$"></FONT> <FONT FACE="***"></FONT> <FONT POINT-SIZE=?></FONT> <FONT WEIGHT=?></FONT> <BASEFONT SIZE=?> (from 1-7; default is 3) <MARQUEE></MARQUEE>

POSITIONING

No license: PDF produced by PStill (c) F. Siegert - http://www.this.net/~frank/pstill.html


N3 N3 N3 N3

Multi-Column Column Gutter Column Width Spacer

N3

Spacer Type

N3 N3 N3 N4 N4 N4 N4 N4 N4

Size Dimensions Alignment Layer Name Location Rel. Position Source File Stacking

N4

Stack Position

N4 N4 N4

Dimensions Clipping Path Visible?

N4

Background

N4

Color

<MULTICOL COLS=?></MULTICOL> <MULTICOL GUTTER=?></MULTICOL> <MULTICOL WIDTH=?></MULTICOL> <SPACER> <SPACER TYPE=HORIZONTAL|VERTICAL|BLOCK> <SPACER SIZE=?> <SPACER WIDTH=? HEIGHT=?> <SPACER ALIGN=LEFT|RIGHT|CENTER> <LAYER></LAYER> <LAYER ID="***"></LAYER> <LAYER LEFT=? TOP=?></LAYER> <LAYER PAGEX=? PAGEY=?></LAYER> <LAYER SRC="***"></LAYER> <LAYER Z-INDEX=?></LAYER> <LAYER ABOVE="***" BELOW="***"></LAYER> <LAYER HEIGHT=? WIDTH=?></LAYER> <LAYER CLIP=,,,></LAYER> <LAYER VISIBILITY=SHOW|HIDDEN|INHERIT></LAYER> <LAYER BACKGROUND="$$$$$$"></LAYER> <LAYER BGCOLOR="$$$$$$"></LAYER>

N4

Inline Layer

<ILAYER></ILAYER>

N4

Alt. Content

<NOLAYER></NOLAYER>

(takes same attributes as LAYER)

LINKS, GRAPHICS, AND SOUNDS Link Something <A HREF="URL"></A> Link to Location <A HREF="URL#***"></A> <A HREF="#***"></A>

4.0* Target Window 4.0* Action on Click Mouseover 4.0* Action Mouse out 4.0* Action Link to Email N, Specify Subject MS Define Location Display Image Alignment

(if in another document) (if in current document)

<A HREF="URL" TARGET="***"></A> <A HREF="URL" ONCLICK="***"></A>

(Javascript)

<A HREF="URL" ONMOUSEOVER="***"></A>

(Javascript)

<A HREF="URL" ONMOUSEOUT="***"></A>

(Javascript)

<A HREF="mailto:@"></A> <A HREF="mailto:@?SUBJECT=***"></A>

(use a real question mark)

<A NAME="***"></A> <IMG SRC="URL"> <IMG SRC="URL" ALIGN=TOP|BOTTOM|MIDDLE|LEFT|RIGHT>

No license: PDF produced by PStill (c) F. Siegert - http://www.this.net/~frank/pstill.html


N1

Alignment

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

Alternate

<IMG SRC="URL" ALT="***">

Dimensions

<IMG SRC="URL" WIDTH=? HEIGHT=?>

<IMG SRC="URL" BORDER=?>

(if image not displayed) (in pixels) (as percentage of page width/height) (in pixels)

<IMG SRC="URL" HSPACE=? VSPACE=?>

(in pixels)

<IMG SRC="URL" WIDTH=% HEIGHT=%>

N1

MS MS

Border Runaround Space Low-Res Proxy Imagemap Imagemap Movie Clip Background Sound

<IMG SRC="URL" LOWSRC="URL"> <IMG SRC="URL" ISMAP> <IMG SRC="URL" USEMAP="URL"> <IMG DYNSRC="***" START="***" LOOP=?>

(requires a script)

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

(describes the map)

Client-Side Map <MAP NAME="***"></MAP>

N1

Client Pull

<AREA SHAPE="DEFAULT|RECT|CIRCLE|POLY" COORDS=",,," HREF="URL"|NOHREF> <META HTTP-EQUIV="Refresh" CONTENT="?; URL=URL">

N2

Embed Object

<EMBED SRC="URL">

N2 4.0 4.0

Object Size Object Parameters

<EMBED SRC="URL" WIDTH=? HEIGHT=?> <OBJECT></OBJECT> <PARAM>

Map Section

(insert object into page)

DIVIDERS Paragraph

<P></P>

<P ALIGN=LEFT|CENTER|RIGHT></P> <P ALIGN=JUSTIFY></P> Justify Text <BR> Line Break Clear Textwrap <BR CLEAR=LEFT|RIGHT|ALL> Horizontal Rule <HR> <HR ALIGN=LEFT|RIGHT|CENTER> Alignment <HR SIZE=?> Thickness <HR WIDTH=?> Width

(closing tag often unnecessary)

Align Text N

Width Percent

<HR WIDTH="%">

N1

Solid Line No Break

<HR NOSHADE> <NOBR></NOBR>

N1

Word Break

<WBR>

No license: PDF produced by PStill (c) F. Siegert - http://www.this.net/~frank/pstill.html

(a single carriage return)

(in pixels) (in pixels) (as a percentage of page width) (without the 3D cutout look) (prevents line breaks) (where to break a line if needed)


LISTS Unordered List Compact Bullet Type Bullet Type Ordered List Compact Numbering Type Numbering Type Starting Number Starting Number Definition List Compact Menu List Compact Directory List Compact

<UL><LI></UL> <UL COMPACT></UL> <UL TYPE=DISC|CIRCLE|SQUARE> <LI TYPE=DISC|CIRCLE|SQUARE> <OL><LI></OL> <OL COMPACT></OL> <OL TYPE=A|a|I|i|1> <LI TYPE=A|a|I|i|1> <OL START=?> <LI VALUE=?> <DL><DT><DD></DL> <DL COMPACT></DL> <MENU><LI></MENU> <MENU COMPACT></MENU> <DIR><LI></DIR> <DIR COMPACT></DIR>

(before each list item) (for the whole list) (this & subsequent) (before each list item) (for the whole list) (this & subsequent) (for the whole list) (this & subsequent) (<DT>=term, <DD>=definition) (before each list item) (before each list item)

BACKGROUNDS AND COLORS Tiled Bkground <BODY BACKGROUND="URL"> MS

<BODY BGPROPERTIES="FIXED"> Bkground Color <BODY BGCOLOR="#$$$$$$"> <BODY TEXT="#$$$$$$"> Text Color <BODY LINK="#$$$$$$"> Link Color <BODY VLINK="#$$$$$$"> Visited Link <BODY ALINK="#$$$$$$"> Active Link

Watermark

(order is red/green/blue)

(More info at http://werbach.com/web/wwwhelp.html#color)

SPECIAL CHARACTERS Special Character < > & " Registered TM Registered TM Copyright Copyright Non-Breaking Space

&#?; &lt; &gt; &amp; &quot; &#174; &reg; &#169; &copy; &nbsp;

No license: PDF produced by PStill (c) F. Siegert - http://www.this.net/~frank/pstill.html

(where ? is the ISO 8859-1 code)


(Complete list at http://www.uni-passau.de/%7Eramsch/iso8859-1.html)

FORMS <FORM ACTION="URL" METHOD=GET|POST></FORM> <FORM ENCTYPE="multipart/form-data"></FORM> File Upload <INPUT TYPE="TEXT|PASSWORD|CHECKBOX|RADIO| Input Field FILE|BUTTON|IMAGE|HIDDEN|SUBMIT|RESET"> <INPUT NAME="***"> Field Name <INPUT VALUE="***"> Field Value <INPUT CHECKED> (checkboxes and radio boxes) Checked? <INPUT SIZE=?> (in characters) Field Size <INPUT MAXLENGTH=?> (in characters) Max Length <BUTTON></BUTTON> Button <BUTTON Button Name NAME="***"></BUTTON> <BUTTON TYPE="SUBMIT|RESET|BUTTON"></BUTTON> Button Type <BUTTON Default Value VALUE="***"></BUTTON> <LABEL></LABEL> Label <LABEL FOR="***"></LABEL> Item Labelled <SELECT></SELECT> Selection List <SELECT Name of List NAME="***"></SELECT> <SELECT SIZE=?></SELECT> # of Options (can select more than one) Multiple Choice <SELECT MULTIPLE> <OPTION> (items that can be selected) Option Default Option <OPTION SELECTED> <OPTION VALUE="***"> Option Value <OPTGROUP Option Group LABEL="***"></OPTGROUP> <TEXTAREA ROWS=? Input Box Size COLS=?></TEXTAREA> <TEXTAREA Name of Box NAME="***"></TEXTAREA> <TEXTAREA WRAP=OFF|HARD|SOFT></TEXTAREA> Wrap Text Group elements <FIELDSET></FIELDSET> <LEGEND></LEGEND> (caption for fieldsets) Legend <LEGEND ALIGN="TOP|BOTTOM|LEFT|RIGHT"></LEGEND> Alignment

Define Form 4.0*

4.0 4.0 4.0 4.0 4.0 4.0

4.0

N2 4.0 4.0 4.0

TABLES <TABLE></TABLE> Define Table 4.0* Table Alignment <TABLE ALIGN=LEFT|RIGHT|CENTER> <TABLE BORDER></TABLE> Table Border

Table Border

<TABLE BORDER=?></TABLE>

Cell Spacing

<TABLE CELLSPACING=?>

No license: PDF produced by PStill (c) F. Siegert - http://www.this.net/~frank/pstill.html

(either on or off) (you can set the value)


Cell Padding Desired Width Width Percent 4.0* Table Color 4.0 Table Frame

Table Row Alignment

<TABLE CELLPADDING=?> <TABLE WIDTH=?> (in pixels) <TABLE WIDTH=%> (percentage of page) <TABLE BGCOLOR="$$$$$$"></TABLE> <TABLE FRAME=VOID|ABOVE|BELOW|HSIDES|LHS|RHS| VSIDES|BOX|BORDER></TABLE> <TABLE RULES=NONE|GROUPS|ROWS|COLS|ALL></TABLE> <TABLE BORDERCOLOR="$$$$$$"></TABLE> <TABLE BORDERCOLORDARK="$$$$$$"></TABLE> <TABLE BORDERCOLORLIGHT="$$$$$$"></TABLE> <TR></TR> <TR ALIGN=LEFT|RIGHT|CENTER|MIDDLE|BOTTOM>

Table Cell

<TD></TD>

4.0

Table Rules

MS

Border Color

MS

Dark Border

MS

Light Border

4.0* N3 4.0*

4.0* N3 4.0* 4.0 4.0 4.0

4.0

<TD ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM> Alignment <TD NOWRAP> No linebreaks Columns to Span <TD COLSPAN=?> <TD ROWSPAN=?> Rows to Span (in pixels) Desired Width <TD WIDTH=?> <TD WIDTH="%"> (percentage of table) Width Percent <TD BGCOLOR="#$$$$$$"> Cell Color (same as data, except <TH></TH> Header Cell bold centered) <TH ALIGN=LEFT|RIGHT|CENTER|MIDDLE|BOTTOM> Alignment No Linebreaks <TH NOWRAP> Columns to Span <TH COLSPAN=?> <TH ROWSPAN=?> Rows to Span (in pixels) Desired Width <TH WIDTH=?> <TH WIDTH="%"> (percentage of table) Width Percent <TH BGCOLOR="#$$$$$$"> Cell Color <TBODY> Table Body (must come before <TFOOT></TFOOT> Table Footer THEAD>

Table Header Table Caption Alignment

<THEAD></THEAD> <CAPTION></CAPTION> <CAPTION ALIGN=TOP|BOTTOM|LEFT|RIGHT>

Column

<COL></COL>

4.0 4.0

Columns Spanned Column Width Width Percent

4.0

Group columns <COLGROUP></COLGROUP>

4.0

(must appear within table rows)

(groups column attributes)

<COL SPAN=?></COL> <COL WIDTH=?></COL> <COL WIDTH="%"></COL>

No license: PDF produced by PStill (c) F. Siegert - http://www.this.net/~frank/pstill.html

(groups column structure)


4.0 4.0 4.0

Columns Spanned Group Width Width Percent

<COLGROUP SPAN=?></COLGROUP> <COLGROUP WIDTH=?></COLGROUP> <COLGROUP WIDTH="%"></COLGROUP>

FRAMES 4.0* Frame Document <FRAMESET></FRAMESET> <FRAMESET 4.0* Row Heights ROWS=,,,></FRAMESET>

(instead of <BODY>) (pixels or %)

<FRAMESET (* = relative size) ROWS=*></FRAMESET> <FRAMESET (pixels or %) Column Widths COLS=,,,></FRAMESET> <FRAMESET (* = relative size) Column Widths COLS=*></FRAMESET> <FRAMESET FRAMEBORDER="yes|no"></FRAMESET> Borders <FRAMESET Border Width BORDER=?></FRAMESET> <FRAMESET BORDERCOLOR="#$$$$$$"></FRAMESET> Border Color <FRAMESET Frame Spacing FRAMESPACING=?></FRAMESET >

4.0* Row Heights 4.0* 4.0* 4.0* 4.0* 4.0* N3

4.0* Define Frame

<FRAME>

Display Document 4.0* Frame Name 4.0* Margin Width 4.0* Margin Height 4.0*

4.0* Scrollbar? 4.0* Not Resizable 4.0* Borders 4.0* Border Color

(contents of an individual frame)

<FRAME SRC="URL"> <FRAME NAME="***"|_blank|_self|_parent|_top> <FRAME MARGINWIDTH=?> (left and right margins) <FRAME MARGINHEIGHT=?> (top and bottom margins) <FRAME SCROLLING="YES|NO|AUTO"> <FRAME NORESIZE> <FRAME FRAMEBORDER="yes|no"> <FRAME BORDERCOLOR="#$$$$$$">

4.0*

Unframed Content

<NOFRAMES></NOFRAMES>

(for non-frames browsers)

4.0

Inline Frame

<IFRAME></IFRAME>

(takes same attributes as FRAME)

4.0

Dimensions

4.0

Dimensions

<IFRAME WIDTH=? HEIGHT=?></IFRAME> <IFRAME WIDTH="%" HEIGHT="%"></IFRAME>

SCRIPTS AND JAVA Script Location

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

No license: PDF produced by PStill (c) F. Siegert - http://www.this.net/~frank/pstill.html


Type

<SCRIPT TYPE="***"></SCRIPT> <SCRIPT LANGUAGE="***"></SCRIPT> <NOSCRIPT></NOSCRIPT> <APPLET></APPLET> <APPLET CODE="***"> <APPLET PARAM NAME="***"> <APPLET CODEBASE="URL"> <APPLET NAME="***"> <APPLET ALT="***"> <APPLET ALIGN="LEFT|RIGHT|CENTER"> <APPLET WIDTH=? HEIGHT=?> <APPLET HSPACE=? VSPACE=?> <SERVER></SERVER>

Language 4.0* Other Content Applet File Name Parameters Location Identifier Alt Text Alignment

N4

Size Spacing Server Script

(if scripts not supported)

(for references) (for non-Java browsers) (in pixels) (in pixels)

MISCELLANEOUS Comment Prologue Searchable Prompt Send Search URL of This File Base Window 4.0* Name Relationship N4

Linked File

4.0

Meta Information Style Sheets Bidirect Off

<!-- *** --> (not displayed by the browser) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"> <ISINDEX> (indicates a searchable index) <ISINDEX PROMPT="***"> (text to prompt input) <A HREF="URL?***"></a> (use a real question mark) <BASE HREF="URL"> (must be in header) <BASE TARGET="***"> <LINK REV="***" REL="***" HREF="URL"> <LINK TYPE="***" SRC="***"></LINK>

(must be in header) (in header)

<META>

(must be in header)

<STYLE></STYLE> <BDO DIR=LTR|RTL></BDO>

(implementations vary) (for certain character sets)

No license: PDF produced by PStill (c) F. Siegert - http://www.this.net/~frank/pstill.html


Html