Preso dal sito: https://www.cheat-sheets.org/sites/html.su/
| HTML/XHTML in one page | |||||||||||||||||||||||
|
Contents: Templates: Standarte template (simple HTML/XHTML document), Simple frame document, All doctypes; Main elements: Usual text, Comments, Links and Anchors, Images; Grouping elements: Block-level grouping, Inline grouping; Structured text: Usual text, Emphasis, Strong Emphasis, Citation, Abbreviation, Acronym, Code, Sample, Variable, Defining instance, User’s text, Quotations, Subscript, Superscript, Document changes; Font style: monospaced text, italic text style, bold text style, “large” font, “small” font, underlined text, striked text; Structured document: Usual text, Preformatted Text, Breaks, Paragraph, Headings, Unordered list, Ordered list, Definition list, Table; Form’s elements: Form’s templates, Input, Text field, Password field, Checkbox, Radio, Submit button, Reset button, Hidden field, Image, File field, Select element, Text Area, Label; Other: Appendix “HTML/XHTML Character Entities”, Appendix “URL Encoded Characters”, Related References (Review, Documentation, etc.), Tools (Validators, etc.). |
|||||||||||||||||||||||
| Standarte template (simple HTML/XHTML document) | Simple frame document | ||||||||||||||||||||||
|
<html lang=”en”> <head> <meta charset=”utf-8″ /> <title>… replace with your document’s title …</title> <meta name=”description” content=”… replace with your document’s description …” /> <meta name=”keywords” content=”… replace with your document’s keywords …” /> <link rel=”stylesheet” type=”text/css” href=”… replace with your document’s stylesheet location …” /> <style> … CSS … </style> <script> … JavaScript … </script> </head> <body> … replace with your document’s content … </body> </html> |
<html> <head> <title>A simple frameset document</title> </head> <frameset cols=”20%, 80%”> <frameset rows=”100, 200″> <frame src=”contents_of_frame1.html” /> <frame src=”contents_of_frame2.gif” /> </frameset> <frame src=”contents_of_frame3.html” /> <noframes> <p>This frameset document contains:</p> <ul> <li><a href=”contents_of_frame1.html”>Some neat contents</a></li> <li><img src=”contents_of_frame2.gif” alt=”A neat image” /></li> <li><a href=”contents_of_frame3.html”>Some other neat contents</a></li> </ul> </noframes> </frameset> </html> |
||||||||||||||||||||||
| Text | Preformatted Text: <pre> </pre> | Form’s templates | |||||||||||||||||||||
| This is a text. | This is a text. |
<pre>
voclass Node::Remove()
{
if (prev)
prev->next = next;
else if (parent)
parent->SetContent(null);
if (next)
next->prev = prev;
parent = null;
}
</pre>
|
voclass Node::Remove()
{
if (prev)
prev->next = next;
else if (parent)
parent->SetContent(null);
if (next)
next->prev = prev;
parent = null;
}
|
<form action=”… url of cgi script … ” method=”get” name=”” id=”” > …form contents… </form> |
|||||||||||||||||||
| Comments: <!– –> | |||||||||||||||||||||||
| <!–This is a comments–> | |||||||||||||||||||||||
| Links and anchors: <a href=” “> </a> | |||||||||||||||||||||||
|
This a link to <a href=”http://www.cheat-sheets.org/” title=”Cheat-sheets.org”>Cheat-sheets.org</a>. And this a link to <a href=”http://www.cheat-sheets.org/” title=”Cheat-sheets.org” target=”_blank”>Cheat-sheets.org</a> (opened in new page). |
This a link to Cheat-sheets.org. And this a link to Cheat-sheets.org (opened in new page). |
<form action=”… url of cgi script … ” method=”put” enctype=”multipart/form-data” name=”” id=””>
…form contents… </form> |
|||||||||||||||||||||
|
<a href=”#my-link”>To my link</a> <a name=”my-link”>My link</a> |
To my link My link |
Breaks: <br /> | |||||||||||||||||||||
| First string.<br />Second string. | First string. Second string. |
Input: <input /> | |||||||||||||||||||||
| Paragraph: <p> </p> | <input type=”text” value=”…text…” size=”32″ maxlength=”255″ name=”” id=”” /> |
||||||||||||||||||||||
| <a href=”mailto:info@itlibitum.ru”>Mail me</a> | Mail me |
<p>This is the first paragraph</p> <p>This is the second paragraph</p> |
This is the first paragraph This is the second paragrap |
||||||||||||||||||||
| Images: <img src=” ” alt=” ” /> | Headings: <h1> </h1> | <input type=”password” name=”” id=”” /> |
|||||||||||||||||||||
| <img src=”logo.gif” width=”” height=”” alt=”description” longdesc=”long description” /> |  |
<h1>h1</h1> <h2>h2</h2> <h3>h3</h3> <h4>h4</h4> <h5>h5</h5> <h6>h6</h6> |
h1h2h3h4h5h6 |
||||||||||||||||||||
| Block-level grouping elements: <div> </div> |
<input type=”checkbox” name=”” value=”” />First<br /> <input type=”checkbox” checked=”checked” name=”” value=”” />Second |
First Second |
|||||||||||||||||||||
|
<div class=”” id=””><br /> element 1<br /> element 2<br /> element 2<br /> </div> |
element 1 element 2 element 2 |
||||||||||||||||||||||
|
<input type=”radio” name=”” value=”” />First<br /> <input type=”radio” checked=”checked” name=”” value=”” />Second |
First Second |
||||||||||||||||||||||
| Inline grouping elements: <span> </span> |
Unordered list: <ul><li> </li></ul> | ||||||||||||||||||||||
|
<ul> <li>first item</li> <li>second item</li> <li>third item</li>> </ul> |
|
||||||||||||||||||||||
|
<span class=”” id=””>e1</span><br /> <span class=”” id=””>e2</span><br /> <span class=”” id=””>e3</span> |
e1 e2 e3 |
<input type=”submit” value=”… submit …” name=”” id=”” /> |
|||||||||||||||||||||
| Emphasis: <em></em>; <strong></strong> |
Ordered list: <ol><li> </li></ol> | <input type=”reset” value=”… reset …” name=”” id=”” /> |
|||||||||||||||||||||
|
<ol> <li>first item</li> <li>second item</li> <li>third item</li>> </ol> |
|
||||||||||||||||||||||
| <em>Emphasis.</em> | Emphasis. | ||||||||||||||||||||||
| <strong>Stronger emphasis.</strong> |
Stronger emphasis | <input type=”button” value=”… button …” name=”” id=”” /> |
|||||||||||||||||||||
| Citation: <cite> </cite> <q> </q> |
Definition list: <dl><dt> </dt> <dd> </dd></dl> |
||||||||||||||||||||||
| <input type=”hidden” value=”… value …” name=”… name …” id=”” /> | |||||||||||||||||||||||
| As <cite>Harry S. Truman</cite> said: <q lang=”en-us”>The buck stops here</q>. |
As Harry S. Truman said: The buck stops here.
|
<dl> <dt>first term</dt> <dd>definition</dd> <dt>second term</dt> <dd>definition</dd> <dt>third term</dt> <dd>definition</dd> </dl> |
|
||||||||||||||||||||
| <input type=”image” src=”logo.gif” value=”… value …” name=”” id=”” /> |
|||||||||||||||||||||||
| Abbreviation: <abbr></abbr> | |||||||||||||||||||||||
| <abbr lang=”en” title=”World Wide Web”>WWW</abbr> | WWW | ||||||||||||||||||||||
| <input type=”file” value=”… file name …” name=”” id=”” /> |
|||||||||||||||||||||||
| Acronym: <acronym></acronym> | Table: <table><tr><td></td></tr></table> |
||||||||||||||||||||||
|
<acronym lang=”en” title=”North Atlantic Treaty Organization”> NATO</acronym> |
NATO | ||||||||||||||||||||||
|
<table border=”1″ cellpadding=”10″ cellspacing=”5″ width=”80%”> <caption align=”top”>Example table</caption> <tr align=”center”> <th rowspan=”2″>Year</th> <th colspan=”3″>Sales</th> <!–2 cells–> </tr> <tr align=”center”> <!–1 cell–> <th valign=”top”>North</th> <th valign=”middle”>South</th> <th valign=”bottom”>Total</th> </tr> <tr align=”center”> <td align=”left”>2004</td> <td align=”right”>$10M</td> <td align=”right”>$8M</td> <td align=”right”>$18M</td> </tr> <tr align=”center”> <td align=”left”>2005</td> <td align=”right”>$14M</td> <td align=”right”>$11M</td> <td align=”right”>$25M</td> </tr> <tr align=”center”> <td align=”left”>2006</td> <td align=”right”> </td> <td align=”right”> </td> <td align=”right”> </td> </tr> </table> |
|
Select: <select><option></option></select> |
|||||||||||||||||||||
| Code: <code> </code> |
<select name=”” id=””> <option>element_1</option> <option>element_2</option> <option>element_3</option> <option>element_4</option> <option>element_5</option> </select> |
||||||||||||||||||||||
| <code>code</code> | code |
||||||||||||||||||||||
| Sample: <samp></samp> | |||||||||||||||||||||||
| <samp>sample</samp> | sample | ||||||||||||||||||||||
| Variable: <var></var> | |||||||||||||||||||||||
| <var>variable</var> | variable | ||||||||||||||||||||||
| Defining instance: <dfn></dfn> |
<select multiple=”multiple” size=”3″ name=”” id=””> <option selected=”selected”> element_1</option> <option selected=”selected”> element_2</option> <option>element_3</option> <option>element_4</option> <option>element_5</option> </select> |
||||||||||||||||||||||
| <dfn>defining instance</dfn> | defining instance | ||||||||||||||||||||||
| Text entered the user: <kbd></kbd> | |||||||||||||||||||||||
| <kbd>user’s text</kbd> | user's text | ||||||||||||||||||||||
| Quotations: <blockquote></blockquote> |
|||||||||||||||||||||||
| <blockquote cite=”http://www.mycom.com/tolkien/twotowers.html”> They went in single file, running like hounds on a strong scent, and an eager light was in their eyes. Nearly due west the broad swath of the marching Orcs tramped its ugly slot; the sweet grass of Rohan had been bruised and blackened as they passed. </blockquote> |
They went in single file, running like hounds on a strong scent, and an eager light was in their eyes. Nearly due west the broad swath of the marching Orcs tramped its ugly slot; the sweet grass of Rohan had been bruised and blackened as they passed. |
||||||||||||||||||||||
|
<select name=”” id=””> <option selected=”selected” label=”none” value=”none”> None</option> <optgroup label=”Group 1″> <option label=”1.1″ value=”o_1.1″> Option 1.1</option> <option label=”1.2″ value=”o_1.2″> Option 1.2</option> <option label=”1.3″ value=”o_1.3″> Option 1.3</option> </optgroup> <optgroup label=”Group 2″> <option label=”2.1″ value=”o_1.4″> Option 2.1</option> <option label=”2.2″ value=”o_1.5″> Option 2.2</option> </optgroup> <optgroup label=”Group 3″> <option label=”3.1″ value=”o_1.6″> Option 3.1</option> <option label=”3.2″ value=”o_1.7″> Option 3.2</option> </optgroup> </select> |
|||||||||||||||||||||||
| Subscript: <sub>/<sub> | |||||||||||||||||||||||
| H<sub>2</sub>O | H2O | ||||||||||||||||||||||
| Superscript: <sup></sup> | Related References | ||||||||||||||||||||||
| E=mc<sup>2</sup> | E=mc2 |
Main pages: W3C HTML Home Page >> Review: Introduction to HTML 4 >> Getting started with HTML >> More advanced HTML features >> Documentation: HTML 4.01 Specification >> The global structure of an HTML document >> Text – Paragraphs, Lines, and Phrases >> Lists – Unordered, Ordered, and Definition Lists >> Tables >> Links – Hypertext and Media-Independent Links >> Objects, Images, and Applets >> Style Sheets – Adding style to HTML documents >> Alignment, font styles, and horizontal rules >> Frames – Multi-view presentation of documents >> Forms – User-input Forms: Text Fields, Buttons, Menus, and more >> Scripts – Animated Documents and Smart Forms >> Index of Elements >> Index of Attributes >> XHTML™ 1.0 The Extensible HyperText Markup Language (Second Edition) >> Code for the Representation of the Names of Languages. From ISO 639 >> [RFC1738] URI – “Uniform Resource Locators” >> [URI] “Uniform Resource Identifiers (URI): Generic Syntax” >> [UNICODE] The Unicode Consortium. The Unicode Standard, Version 4.1.0 >> [RFC2279] “UTF-8, a transformation format of ISO 10646” >> |
|||||||||||||||||||||
| Document changes: <ins></ins><del></del> |
|||||||||||||||||||||||
| A Sheriff can employ <del>3</del> <ins datetime=”” cite=”” title=””>5</ins> deputies. | A Sheriff can employ |
||||||||||||||||||||||
| Font style: tt, i, b, big, small, strike, s, u | |||||||||||||||||||||||
| <tt>monospaced text</tt> | monospaced text | ||||||||||||||||||||||
| <i>italic text style</i> | italic text style | ||||||||||||||||||||||
| <b>bold text style</b> | bold text style | ||||||||||||||||||||||
| <big>”large” font</big> | “large” font | ||||||||||||||||||||||
| <small>”small” font</small> | “small” font | Text area: <textarea></textarea> | |||||||||||||||||||||
| Related themes | <textarea name=”” id=”” rows=”6″ cols=”40″> First line of initial text. Second line of initial text. </textarea> |
||||||||||||||||||||||
|
CSS – Cascading Style Sheets (CSS.SU) XML – eXtensible Markup Language (XML.SU) DTD – DocType Declaration |
|||||||||||||||||||||||
| Label: <label></label> | |||||||||||||||||||||||
| <label for=”id_text_area”>First name</label> | |||||||||||||||||||||||
| Tools | Miscellaneous | ||||||||||||||||||||||
Validators:
|
|
||||||||||||||||||||||
