%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% HTML Cheat Sheet %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% ------------------------------------------------------------------------------------------------------------ NOTES: - mostly complete, still need to fill in some descriptions - Document released under the NRCOL license. ----------------------------------------------------------------------------------------------------------- --- BASE ----------------------------------------------------------------------------------------------------- the base url (i.e. relative base of ../../) deprecated -------------------------------------------------------------------------------------------------------------- --- EMPHASIS ----------------------------------------------------------------------------------------------- Abbreviated word, like "etc.". Helps give information to browsers, search-engine bots, etc.. Acronym for words, like "NAFTA". Helps give information to browsers, search-engine bots, etc..
For signatures, addresses, or if you are an author of a page. Emphasises as bold text Larger text. opposite of Emphasis of a citation Emphasises a word as a definition term. Not a definition list term. Emphasises as itallic text Smaller text. opposite of Useful to color highlight text. It groups inline-elements of a document Emphasises striken out text Emphasises strong text, similar to bold text Subscript Superscript TeleType/MonoType Deprecated. underlines enclosed text Emphasises a variable -------------------------------------------------------------------------------------------------------------- --- START/SETUP OF THE HTML PAGE ----------------------------------------------------------------------------- Defines the type of document, i.e. xhtml, html, text States the document is html The head area of the page, usually after the tag Title of the page. Place this in the <head> section <meta> For keywords, search engine directives, author of page, and more. Place in <head> area <body> The body of the page, usually after the <head> or <html> tag -------------------------------------------------------------------------------------------------------------- --- PAGE ORGANIZATION, BREAKS, AND SECTIONS ------------------------------------------------------------------------------------ <br> a line break output to the browser <hr> a horizinal rule that can help break up the page into sections <p> enclose a paragraph and space it from other text <blockquote> indent a long quotation of text in an indented block <ul> Unordered list, i.e. bullet lists <ol> Ordered list, i.e. with numbers or letters <li> List item within an ordered or unorded list <dl> A definition list <dt> Definition term (like a heading) within a definition list <dd> A definition phrase (indented like a blockquote) within a definition list -------------------------------------------------------------------------------------------------------------- --- FORMS AND INPUT ------------------------------------------------------------------------------------------ <form> enclose a form, usually for input such as text, textareas, submit buttons. <button> a clickable button <textarea> edit box that can contain more than one line of input text <input> single line edit box for input text -------------------------------------------------------------------------------------------------------------- --- FRAMES ------------------------------------------------------------------------------------------------------ <frame> A frame. Use one or multiple frames inside a <frameset> <frameset> Most search engines don't parse these well. More efficient than full page reloads though. <iframe> Embedded frame in the page. More embedded than a regular <frame> <noframes> if the browser does not support frames, enclosed html is displated -------------------------------------------------------------------------------------------------------------- --- MAPS & REGIONS ----------------------------------------------------------------------------------------------- <map> special image with ability to click on portions of it lik a map <area> Region within a <map> -------------------------------------------------------------------------------------------------------------- --- TABLES & CELLS ----------------------------------------------------------------------------------------------- <table> a table with cells <caption> Caption of a table. Tag is placed right after the table tag <tr> Row in a table <td> Column in a table. Comes after <tr> <thead> To organize a table, this is the head or header part <tbody> To organize a table, this is the body or content part. <tr> should come after it if you use this <tfoot> To organize a table, this is the foot or footer part. <th> -------------------------------------------------------------------------------------------------------------- --- PRESERVED OUTPUT ----------------------------------------------------------------------------------------------- <code> Similar to <pre>, geared toward programmers code <pre> Text output is as is with carriage returns and all preserved <xmp> Deprecated but useful. Similar to <pre> but preserves special characters. -------------------------------------------------------------------------------------------------------------- --- MISCELLANEOUS --------------------------------------------------------------------------------------------- <center> Center justify everything enclosed <col> Specify attributes for columns in a table. Use inside <colgroup> or <table> <colgroup> Group columns together for formatting (i.e. <style>). Use inside a <table> <bdo> change the text direction from right to left or left to right <applet> For embedded applets on the page <h1>...<h6> Heading size 1 to 6. Smaller number mean bigger heading font sizes <img> Insert an image into the page (i.e. png, bmp, jpg, gif) <ins> <kbd> <label> <legend> <link> <!--> Comment within the page. won't show up in browser <a> Anchor. used for links (href) and other anchors <del> <dir> <div> <em> <fieldset> <font> <menu> Deprecated <noscript> <object> <optgroup> <option> <param> <q> <s> <samp> <script> Insert a script, such as javascript, into the page <select> <style> %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% Contributors: -Lars (L505) %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% ~NRCOL Text Document %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%