html quick reference
this document goes back to 1996 when i first started experimenting with the web, html, ... and has been updated several times. however this quick reference is far from being complete and covers html only, no css, no java script, nothing but html. do not complain. i warned you.
toc:
- terms
- colors
- basics
- header
- format elements
- font
- frames
- links and graphics
- tables
- forms
- math
- plugins, video, java
- special characters
| terms | |
|---|---|
|
HTML URL |
Hypertext Markup Language Universal Resource Locator method://server[:Port]/path/file[#anchor] |
| colors | |
| #RRGGBB | colors in html consist of a combination of red, green and blue represented by a two digit hexadecimal number each prefixed by a #. examples: #A03267B, #03B42C |
| basics | |
|
<html>...</html> <head>...</head> <body background="URL" bgcolor=#RRGGBB link=#RRGGBB alink=#RRGGBB vlink=#RRGGBB text=#RRGGBB> ... </body> <!-- ... --> |
optional; encloses the whole document optional; contains header information like the title defines the basic look and feel of the document background picture background color link color active link color visited link color text color this is where the content should be placed invisible comments |
| header elements (between <head> & </head>) | |
|
<title>...</title> <base href="URL" target="framename"> <isindex action="URL" prompt="text"> <isindex href="URL"> <meta name="name" http-equiv="text" content="text"> <nextid n="ID-string"> <bgsound *) src="URL" loop=> |
document title reference url for all following urls frame name; reserved: _blank, _self, _parent, _top page is searchable URL of the search script prompt test . optional; index file meta information e.g.: <meta http-equiv="Refresh" content="3;url=index2.html">, to load another page after 3 seconds identifies the following document background music sound file repetitions or infinite |
| format elements | |
|
<hr src="URL" clear= align= size=pixels width=pixels|%> <p align= nowrap> <center>...</center> <div align=>...</div> <br clear=> <dt> <nobr>...</nobr> <wbr>...</wbr> <ul type= dingbat=icon plain>...</ul> <ol type= start=number continue>...</ol> <dl compact>...</dl> <dir>...</dir> <li> <pre clear= width=Zahl> <multicol cols=number width=pixel|% gutter=number>...<multicol> |
horizontal seperator line ???? left | right | all left | right | center | justify alignment height in pixels length in pixels or % new paragraph left | right | center | justify alignment no automatic line break central text alignment text alignment left | center | right line break left | right | all | none line break no automatic line break automatic line break inside a nobr environment list square | circle | disc point in front of item shaped as square, circle, file symbol icon no symbols sorted list A | a | I | i | 1 numbered with A,B,C / a,b,c / I,II,III / i,ii,iii / 1,2,3 start continue previous list enumeration of definitions directory list list item for one of <ul>, <ol> & <dir> preformatted text left | right | all max. characters per line automatically format text in multiple columns column count width in pixels or % column spacing |
| font | |
|
<hX align=>...<hX> <font size=[1-7] face= color=#RRGGBB> ... </font> logical: <address>...</address> <abbrev>...</abbrev> <acronym>...</acronym> <au>...</au> <blockquote>... </blockquote> <cite>...</cite> <code>...</code> <del>...</del> <dfn>...</dfn> <em>...</em> <ins>...</ins> <kbd>...</kbs> <lang>...</lang> <person>...</person> <q>...</q> <s>...</s> <samp>...</samp> <strong>...</strong> <var>...</var> physical: <b>...</b> <big>...</big> <blink>...</blink> <i>...</i> <u>...</u> <small>...</small> <strike>...</strike> <sub>...</sub> <sup>...</sup> <tt>...</tt> |
headline X left | center | right alignment font size font style font color internet address abbreviation acronym author name cite source code removed text definition emphasize inserted keyboad input changed language context person quick cite canceled example strong variable bold big blinking italic underlined small stroke subscript superscript typewriter type |
| frames | |
|
<frameset rows="X,*" cols="X,*"> <frame ...> </frameset> <frame src="URL" name="frame name" scrolling=yes|no marginwidth= marginheight= border= bordercolor= noresize> <noframes>... </noframes> |
define a frame set rows; X=pixels|% columns; X=pixels|% insert frames here frame definition show this url inside the frame frame name; reserved: _blank, _self, _parent, _top with/without scrollbar margin width margin height border width border color unresizable alternative text for browsers without frame support |
| links and graphics | |
|
<a href="URL" name="anchorname" target="framename"> ...</a> <map name="name"> <area href="URL" nohref shape= coords=> <area ...> </map> <img src="URL" alt="text" border=pixels width=pixels|% height=pixels|% align= vspace=pixels hspace=pixels usemap="#name"> |
yperlink reference reference URL anchow definition; usage: <a href="file.html#anchorname">...</a> framename | _parent open link in frame / without frame define a link map for use with an image URL no link "rect" | "circle" | "polygon" shape of the area coords: rect: x1,y1,x2,y2 | circle: x,y,r | polygon: x1,y1,x2,y1,... <area ...> can be repeated indefinitely show image image file alternative text border width; default: 0 / 3 inside a link width in pixels or %; aspect ratio is preserved heidht in pixels or %; aspect ratio is preserved top | middle | bottom | left | right | texttop | absmiddle | absbottom | baseline alignment vertical space horizontal space connect to a link map (see above) |
| tables | |
|
<table border=pixels|% width=pixels|% height=pixels|% cellspacing=pixels cellpadding=pixels bgcolor=#RRGGBB bordercolor=#RRGGBB bordercolordark= #RRGGBB bordercolorlight= #RRGGBB> ...</table> <tr>...</tr> <td ...>...</td> <th ...>...</th> Optionen für <td> & <th>: align= valign= width=pixels|% height=pixels|% bgcolor=#RRGGBB rowspan= colspan= <caption align= valign=>...</caption> |
border width in pixels or % table width in pixels or % table height in pixels or % space between cells cell padding background color line color line shade color line bright color table row table cell equal to <td ...><center><b>...</b></center></td> left | center | right horizontal alignment top | middle | bottom vertikal alignment cell width in pixels or % cell height in pixels or % background color number of rows number of columns table caption left | center | right horizontal alignment top | bottom vertikal alignment |
| forms | |
|
<form action="URL" method= enctype=> ... </form> <input type="type" src="URL" name="name" size= maxlength= value="text" align= valign= checked> <textarea name="name" rows= cols= warp= > ... </textarea> <select name="name" size= multiple> <option value="name" selected> ... </select> |
begin form URL the form data is transferred to to send an email w/o cgi: <form action=mailto:user@host.de?subject=TheSubject> get | post transfer method: get transfer as url parameter, post directly encoding; e.g. text/html form elements input field type = text | password | checkbox | radio | submit | reset | hidden | file | image | int | float | date | url image file for type="image" name field size max. size preset value left | center | right horizontal alignment top | texttop | middle | absmiddle | bottom | absbottom vertikal alignment selected bigger input field name rows columns virtual | physical transfer line breaks (physical) or not (virtual) preset text list name size allow multiple selections option name select description |
| math formula*) | |
|
<math model="..."> ...</math> <box>...</box> <array>...</array> <arow>...</arow> <item>...</item> <over>, <atop> <above>...</above> <below>...</above> <root root="n"> <sub> <sup> |
element ({...}) LaTeX-syntax row of a field element of a row of a field fraction w/o bar numerator denominator square root of n index (_) power (^) |
| music, videos, plugins, java *) | |
|
<img dynsrc="URL" loop= width=pixels height=pixels src="URL" start=mouseover controls> <sound src="URL" loop= delay=> <embed src="URL"> <applet code="objekt.class" width=pixels height=pixels src="source.java" alt="text" hspace=? vspace=?> <param name=name value="Text"> </applet> <!-- <script language="JavaScript"> ...source code... </script> <// --> |
show video sequences video file repetitions or infinite width in pixels height in pixels alternative image file start playing after the video is in view range show controls play sound sound file repetitions or infinite pause between reperitions use plugin files use java applets parameters use java script |
special characters
|
À à È è Ì ì Ò ò Ù ù Á á É é Í í Ó ó Ú ú Â â Ê ê Î î Ô ô Û û Ã ã Ñ ñ Õ õ Ä ä Ë ë Ï ï Ö ö Ü ü Å å Æ æ Ç ç Ø ø ß & |
À à È è Ì ì Ò ò Ù ù Á á É é Í í Ó ó Ú ú Â â Ê ê Î î Ô ô Û û Ã ã Ñ ñ Õ õ Ä ä Ë ë Ï ï Ö ö Ü ü Å å Æ æ Ç ç Ø ø ß & |
¡ ¿ ¦ § ¢ £ ¥ ¤ © ® µ « » < > ¨ ­ ¯ ° ´ · ¸ ¹ ² ³ ½ ¼ ¾ × ± |
¡ ¿ ¦ § ¢ £ ¥ ¤ © ® µ « » < > ¨ ¯ ° ´ · ¸ ¹ ² ³ ½ ¼ ¾ × ± |
|---|
*) for these elements special browsers or plugins are required