Sunshine HTML Resource HEAD | BODY | Forms | Frames | Images | Layout | Links | Lists | Tables | Text: Logical & Physical

TAGS | ATTRIBUTES ( Common ) | VALUES       ENTITIES       INFO | HELP | AUTHOR

TAG SYNTAX

INSTRUCTIONS:
Common Attributes:     TITLE * . . . CORE § . . . EVENT ¤ . . . LANG . . . DIR »

HEAD ELEMENTS

Basic HTML Template
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3/org/TR/html4/loose.dtd">
<HTML>
<HEAD>

<TITLE> ... </TITLE>
<BASE HREF="___">
<META HTTP-EQUIV="keywords" CONTENT="___">
<META NAME="description" CONTENT="___">

</HEAD>
<BODY BGCOLOR="#___" BACKGROUND="___" TEXT="#___" LINK="#___" VLINK="#___" ALINK="#___">

...(entire document)...

</BODY>
</HTML>

<!DOCTYPE HTML PUBLIC "DTD">

<HTML VERSION="version" § ¤ » > ...(entire document)... </HTML>

<HEAD PROMPT=?> ...(head elements)... </HEAD>

<TITLE » > ...(text)... </TITLE>

<BASE HREF="url" TARGET="FrameTarget">

<META HTTP-EQUIV="http-equiv" NAME="fieldname" CONTENT="values" SCHEME=? >
<META HTTP-EQUIV="http-equiv" CONTENT="values">
<META NAME="fieldname" CONTENT="values">
<META NAME="robots" CONTENT="noindex,follow">

<LINK HREF="url" REL="LinkTypes" REV="LinkTypes TITLE="title" CHARSET="Charset" HREFLANG="LanguageCode" TYPE="ContentType" MEDIA="MediaDesc" TARGET=FrameTarget SRC="url" >
<LINK HREF="url" REL="LinkTypes" TITLE="title">
<LINK HREF="url" REV="LinkTypes" TITLE="title">

<ISINDEX PROMPT="prompt wording" » >

<BGSOUND ="url">

<STYLE ="url">

Scripts

<SERVER>

<SCRIPT>
<NOSCRIPT> ...(alternate text)... </NOSCRIPT>

<APPLET CODEBASE="url" CODE="filename" NAME="appletname" WIDTH=pixels HEIGHT=pixels ALIGN="align" ALT="text" VSPACE=pixels HSPACE=pixels ARCHIVE="url" OBJECT=? * § > ...(alternate text with PARAM tags)... </APPLET>

<PARAM NAME="parametername" VALUE="parametervalue" type=? VALUETYPE=?>

BODY ELEMENTS, ETC.

<BODY BGCOLOR="Color" BACKGROUND="imgurl" TEXT="Color" LINK="Color" VLINK="Color" ALINK="Color" » > ...(body elements)... </BODY>

<!-- ...(comment)... -->

&...entity...;

Text: Logical Markup

<H1 ALIGN="align ID="sectionname" * § ¤ » > ...(text)... </H1>
<H1> ...(text)... </H1>
<H2> ...(text)... </H2>
<H3> ...(text)... </H3>
<H4> ...(text)... </H4>
<H5> ...(text)... </H5>
<H6> ...(text)... </H6>

<EM * § ¤ » > ...(text)... </EM>
<STRONG * § ¤ » > ...(text)... </STRONG>
<SUB * § ¤ » > ...(text)... </SUB>
<SUP * § ¤ » > ...(text)... </SUP>

<CITE * § ¤ » > ...(text)... </CITE>
<CODE * § ¤ » > ...(text)... </CODE>
<KBD * § ¤ » > ...(text)... </KBD>
<SAMP * § ¤ » > ...(text)... </SAMP>
<VAR * § ¤ » > ...(text)... </VAR>

<ADDRESS * § ¤ » > ...(text)... </ADDRESS>
<BLOCKQUOTE CITE="url" * § ¤ » > ...(long text)... </BLOCKQUOTE>
<Q CITE="url" * § ¤ » > ...(brief text)... </Q>

<ABBR TITLE="full spelling" * § ¤ » > ...(text)... </ABBR>
<ACRONYM TITLE="full spelling" * § ¤ » > ...(text)... </ACRONYM>
<DFN * § ¤ » > ...(text)... </DFN>

<INS CITE="url" DATETIME="DateTime" * § ¤ » > ...(text)... </INS>
<DEL CITE="url" DATETIME="DateTime" * § ¤ » > ...(text)... </DEL>

Text: Physical Markup

<BASEFONT COLOR="Color" SIZE="sizer" FACE="fonta,fontb">
<FONT COLOR="Color" SIZE="sizer" FACE="fonta,fontb" POINT-SIZE="points" WEIGHT="weight" * § » > ...(text)... </FONT>

<BIG * § ¤ » > ...(text)... </BIG>
<SMALL * § ¤ » > ...(text)... </SMALL>

<I * § ¤ » > ...(text)... </I>
<B * § ¤ » > ...(text)... </B>
<TT * § ¤ » > ...(text)... </TT>

<U * § ¤ » > ...(text)... </U>
<S * § ¤ » > ...(text)... </S>
<STRIKE * § ¤ » > ...(text)... </STRIKE>
<BLINK * § ¤ » > ...(text)... </BLINK>

Layout

<P ALIGN="alignj" * § ¤ » >
<BR CLEAR="clear" * § >

<DIV ALIGN="alignj" * § ¤ » > ...(long text)... </DIV>
<SPAN * § ¤ » > ...(short text)... </SPAN>
<CENTER * § ¤ » > ...(text)... </CENTER>

<BDO DIR="dir" > ...(text)... </BDO>

<PRE WIDTH=characters * § ¤ » > ...(text)... </PRE>
<PLAINTEXT * § ¤ » > ... (until end -- NO way to shut off)

<NOBR * § ¤ » > ...(text with WBR tags)... </NOBR>
<WBR * § ¤ » >

<MARQUEE> ...(text)... </MARQUEE>

Links

<A HREF="url" NAME="sectionname" TARGET="FrameTarget" TITLE="title" REL="LinkTypes" REV="LinkTypes" ACCESSKEY="Character" CHARSET="Charset" HREFLANG="LanguageCode" ONBLUR="scripturl" ONFOCUS="scripturl" TABINDEX="tabindex" TYPE="MediaDesc" * § ¤ » > ...(text)... </A>

<A HREF="url#sectionname"> ...(text)... </A>

<A NAME="sectionname"> ...(text or not)... </A>
<A ID="sectionname"> ...(text or not)... </A>

<A SHAPE="Shape" COORDS="Coords" HREF="url" ALT="text" * § ¤ » > ...(text menu wording)... </A>
<A SHAPE="Shape" COORDS="Coords" NOHREF ALT="text" * § ¤ » > ...(text menu wording)... </A>

Image Maps

NEW Client-Side Image Map with Alternate Text Menu
<OBJECT USEMAP="#___" DATA="___" TYPE="___" WIDTH=___ HEIGHT=___ ALT="___" BORDER=___>

...

<MAP NAME="___">
  <A SHAPE="___" COORDS="___" HREF="___" ALT="___"> ... </A>
  <A SHAPE="___" COORDS="___" NOHREF ALT="___"> ... </A>
</MAP>

<OBJECT USEMAP="url#mapname" DATA="imgurl" TYPE="MediaDesc" WIDTH="width" HEIGHT=pixels ALT="text" BORDER=pixels * § ¤ » >
<MAP NAME="mapname" * § ¤ » > ...(A SHAPE tags and text)... </MAP>
<A SHAPE="Shape" COORDS="Coords" HREF="url" ALT="text" * § ¤ » > ...(text menu wording)... </A>
<A SHAPE="Shape" COORDS="Coords" NOHREF ALT="text" * § ¤ » > ... </A>

Classic Client-Side Image Map
<IMG USEMAP="#___" SRC="___" WIDTH=___ HEIGHT=___ ALT="___" BORDER=___>

...

<MAP NAME="___">
  <AREA HREF="___" SHAPE="___" COORDS="___" ALT="___">
  <AREA NOHREF SHAPE="___" COORDS="___" ALT="___">
</MAP>

<IMG USEMAP="url#mapname" SRC="imgurl" WIDTH="width" HEIGHT=pixels ALT="text" BORDER=pixels * § ¤ » >
<MAP NAME="mapname" * § ¤ » > ...(AREA tags)... </MAP>
<AREA SHAPE="Shape" COORDS="Coords" HREF="url" ALT="text" * § ¤ » >
<AREA SHAPE="Shape" COORDS="Coords" NOHREF ALT="text" * § ¤ » >

Classic Server-Side Image Map
 <A HREF="___"><IMG ISMAP SRC="___" WIDTH=___ HEIGHT=___ ALT="___" BORDER=___></A> 

<IMG ISMAP SRC="imgurl" WIDTH="width" HEIGHT=pixels ALT="text" BORDER=pixels * § ¤ » >

Images and Other Multi-Media

<IMG SRC="url" ALT="text" WIDTH=width HEIGHT=pixels ALIGN="ialign" VSPACE=pixels HSPACE=pixels BORDER=pixels LOWSRC="url" * § ¤ » >
<IMG SRC="url" ALT="text" WIDTH=width HEIGHT=pixels BORDER=pixels>

<OBJECT DATA="imgurl" TYPE="MediaDesc" WIDTH="width" HEIGHT=pixels ALT="text" USEMAP="url#mapname" BORDER=pixels * § ¤ » >
<EMBED SRC="url" ALT="text" WIDTH=width HEIGHT=pixels ALIGN="ialign" VSPACE=pixels HSPACE=pixels BORDER=pixels LOWSRC="url" * § ¤ » >

<HR ALIGN="align" WIDTH="width" SIZE=pixels NOSHADE * § ¤ » >

Lists

Basic Ordered List Basic Unordered List Basic Definition List
<OL>
  <LI> ...
  <LI> ...
  <LI> ...
  <LI> ...
</OL>
 		<UL>
  <LI> ...
  <LI> ...
  <LI> ...
  <LI> ...
</UL>
 		<DL>
  <DT> ...
    <DD> ...
  <DT> ...
    <DD> ...
</DL>

<LI TYPE="LIStyle" VALUE=number * § ¤ » > ... (text) ... </LI>

<DIR COMPACT * § ¤ » > ...(text with LI tags)... </DIR>
<OL COMPACT START=number TYPE="OLStyle" * § ¤ » > ...(text with LI tags)... </OL>
<MENU COMPACT * § ¤ » > ...(text with LI tags)... </MENU>
<UL COMPACT TYPE="ULStyle" * § ¤ » > ...(text with LI tags)... </UL>

<DL COMPACT * § ¤ » > ...(text with DT and DD tags)... </DL>
<DT * § ¤ » > ...(text with DD tags)... </DT>
<DD * § ¤ » > ...(text)... </DD>

Tables

Basic Table
<TABLE WIDTH="___" BORDER=___>
<CAPTION ALIGN="___"> ... </CAPTION>
<TR>
  <TH> ...
  <TH> ...
<TR>
  <TD> ...
  <TD> ...
</TABLE>

<TABLE WIDTH="width" BORDER=pixels ALIGN="align" CELLPADDING=pixels CELLSPACING=pixels BGCOLOR="Color" FRAME="TFrame" RULES="TRules" SUMMARY="text" * § ¤ » > ...(text with TR, TH, and TD tags)... </TABLE>

<CAPTION ALIGN="CAlign" * § ¤ » > ...(text)... </CAPTION>

<COLGROUP SPAN=columns ALIGN="align" VALIGN="valign" CHAR="Character" * § ¤ » > ...(COL tags or not)... </COLGROUP>
<COL SPAN=columns ALIGN="align" VALIGN="valign" CHAR="Character" CHAROFF * § ¤ » >

<THEAD * § ¤ » > ...(text with TR, TH, and TD tags)... </THEAD>
<TFOOT * § ¤ » > ...(text with TR, TH, and TD tags)... </TFOOT>
<TBODY * § ¤ » > ...(text with TR, TH, and TD tags)... </TBODY>

<TR ALIGN="align" VALIGN="valign" CHAR="Character" * § ¤ » > ...(text with TH and TD tags)... </TR>

<TH WIDTH="widtht" HEIGHT=pixels COLSPAN=columns ROWSPAN=rows ALIGN="align" VALIGN="valign" CHAR="Character" NOWRAP SCOPE="scope" TID="cellpointer" ABBR="shorttitle" * § ¤ » > ...(text)... </TH>
<TD WIDTH="widtht" HEIGHT=pixels COLSPAN=columns ROWSPAN=rows ALIGN="align" VALIGN="valign" CHAR="Character" NOWRAP SCOPE="scope" TID="cellpointer" HEADERS="cellpointer cellpointer" * § ¤ » > ...(text)... </TD>

Frames

Basic Framed Document
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN"
  "http://www.w3.org/TR/REC-html40/frameset.dtd">
<HTML>

<HEAD>
<TITLE> ... </TITLE>
<BASE HREF="___">
<META HTTP-EQUIV="keywords" CONTENT="___">
<META NAME="description" CONTENT="___">
</HEAD>

<FRAMESET COLS="___" ROWS="___">
  <FRAME SRC="___" NAME="___">
  <FRAME SRC="___" NAME="___">
</FRAMESET>

<NOFRAMES>
<BODY>
...
</BODY>
</NOFRAMES>

</HTML>

<FRAMESET COLS="framediv" ROWS="framediv"> ...(FRAME tags)... </FRAMESET>

<FRAME SRC="url" NAME="framename" SCROLLING="scrolling" MARGINHEIGHT=pixels MARGINWIDTH=pixels NORESIZE>

<NOFRAMES> ...(BODY and alternate text)... </NOFRAMES>

Forms

Basic Form Template
<FORM METHOD="___" ACTION="___">

  <INPUT TYPE=text NAME="___" MAXLENGTH=characters>
  <INPUT TYPE=password NAME="___" MAXLENGTH=characters>
  <TEXTAREA NAME="___" COLS=___ ROWS=___> ... </TEXTAREA>

  <INPUT TYPE=checkbox NAME="___" VALUE="___"> ...
  <INPUT TYPE=checkbox NAME="___" VALUE="___"> ...

  <INPUT TYPE=radio NAME="___" VALUE="___"> ...
  <INPUT TYPE=radio NAME="___" VALUE="___"> ...

  <SELECT NAME="___">
    <OPTION VALUE="___"> ...
    <OPTION VALUE="___"> ...
  </SELECT>

  <INPUT TYPE=file NAME="___">

  <INPUT TYPE=hidden NAME="___" VALUE="___">

  <INPUT TYPE=reset VALUE="___">
  <INPUT TYPE=submit VALUE="___">

</FORM>

<FORM METHOD="method" ACTION="url" ENCTYPE="enctype" * § ¤ » > ...(text with form fields)... </FORM>

<FIELDSET NAME="fieldname" * § ¤ » > ...(LEGEND tag, then text with form fields)... </FIELDSET>
<LEGEND ALIGN="align" * § ¤ » > ...(text with form fields)... </LEGEND>

<LABEL FOR="fieldname" ACCESSKEY="character" * § ¤ » > ...(text with form fields)... </FORM>

<INPUT TYPE="text" NAME="fieldname" VALUE="initial text" MAXLENGTH=characters SIZE=characters * § ¤ » >
<INPUT TYPE="password" NAME="fieldname" VALUE="initialvalue" MAXLENGTH=characters SIZE=characters * § ¤ » >
<TEXTAREA NAME="fieldname" COLS=characters ROWS=characters WRAP="wrap" * § ¤ » > ...(initial text)... </TEXTAREA>

<INPUT TYPE="checkbox" NAME="fieldname" VALUE="value" CHECKED * § ¤ » >
<INPUT TYPE="radio" NAME="fieldname" VALUE="value" CHECKED * § ¤ » >

<SELECT NAME="fieldname" SIZE=rows MULTIPLE * § ¤ » > ...(OPTION tags with text and maybe OPTGROUP tags)... </SELECT>
<OPTGROUP LABEL="groupname" DISABLED * § ¤ » > ...(OPTION tags with text)... </OPTGROUP>
<OPTION VALUE="value" SELECTED DISABLED * § ¤ » > ...(text or not)... </OPTGROUP>

<INPUT TYPE="file" NAME="fieldname" MAXLENGTH=characters SIZE=characters * § ¤ » >

<INPUT TYPE="hidden" NAME="fieldname" VALUE="value" * § ¤ » >

<INPUT TYPE="reset" VALUE="button label" * § ¤ » >
<INPUT TYPE="submit" NAME="submissiontype" VALUE="button label" * § ¤ » >
<INPUT TYPE="image" NAME="fieldname" SRC="imgurl" ALIGN="IAlign" * § ¤ » >
<INPUT TYPE="button" NAME="fieldname" VALUE="value" DISABLED * § ¤ » >
<BUTTON NAME="fieldname" TYPE="buttontype" VALUE="value" DISABLED * § ¤ » > ...(text)... </BUTTON>

If you like the Sunshine HTML Resource or have suggestions for making it better, please fill out this comment form.

Tell me what you think! © Sunny Snaith    Post Office Box 681727, Fort Payne, AL 35968
http://sosayssunny.com/html/tags.html     Last revision:  May 21, 2015     [WELCOME]    [CREDITS]    [PRIVACY]