|
Colani's
HTML Cheatsheet
| Basic
Tags |
<html></html>
Creëert een HTML document |
<head></head>
Zet de titel en andere informatie die niet in de webpagina
zelf getoond wordt |
<body></body>
Zet het zichtbare gedeelte van de webpagina |
|
|
Header
Tags |
<title></title>
Zet de naam van het document in de titelbar |
|
| Body
Attributen |
<body
bgcolor=?>
Zet de achtergrondkleur van een webpagina. Als waarden
gebruik je kleurnamen of hexadecimalen. |
<body
text=?>
Zet de tekstkleuren met kleurnamen of hexadecimalen |
<body
link=?>
Zet de linkkleur van niet-bezochte links met kleurnamen
of hexadecimalen |
<body
vlink=?>
Zet de linkkleur van bezochte links met kleurnamen of
hexadecimalen |
<body
alink=?>
Zet de linkkleur van aktieve links met kleurnamen of
hexadecimalen |
|
| Text
Tags |
<pre></pre>
Gepreformatteerde tekst, whitespace (spaties en hard
returns) wordt getoond zoals hij in de code getypt wordt |
<hl></hl>
Titel niveau 1 (de grootste) |
<h6></h6>
Titel niveau 6 (de kleinste) |
<b></b>
vet |
<i></i>
cursief |
<tt></tt>
Teletype, of schrijfmachine-achtige tekst |
<cite></cite>
Citaat, wordt in de meeste browsers cursief weergegeven |
<em></em>
Benadruk een woord (vet of cursief, afhankelijk van
de browser) |
<strong></strong>
Benadruk een woord (vet of cursief, afhankelijk van
de browser) |
<font size=?></font>
Zet de fontgrootte, waarden van 1 tot en met 6 |
<font color=?></font>
Zet de fontkleur met kleurnamen of hexadecimalen |
|
| Links |
<a href="URL"></a>
Creëer een hyperlink |
<a href="mailto:EMAIL"></a>
Creëer een mail link |
<a name="NAME"></a>
Creëer een doel voor een interne link |
<a href="#NAME"></a>
Link naar het intern doel |
|
| Formatting |
<p></p>
Creëer een nieuwe paragraaf |
<p align=?>
Aligneert een paragraaf. Geldige waarden zijn 'left',
'center' en 'right' |
<br>
Begint een nieuwe regel zonder extra witruimte |
<blockquote>
</blockquote>
Indenteert text aan beide zijden |
<ol></ol>
Creëer een genummerde lijst |
<li></li>
Staat rond elk item van een lijst |
<ul></ul>
Creëer een lijst met bullets |
|
<div align=?>
Generieke tag om blokken code te formatteren. Ook
vaak gebruikt bij stylesheets.
|
|
|
| Graphical
Elements |
<img src="name">
Voegt een beeld toe |
<img src="name" align=?>
Aligneert een beeld met als geldige waarden: left, right,
center; bottom, top, middle |
<img src="name" border=?>
Zet de breedte van de rand rond een beeld |
<hr>
Horizontale ruler |
<hr size=?>
Zet de dikte van de horizontale ruler |
<hr width=?>
Zet de breedte van de horizontale ruler, waarden absoluut
of in percent |
<hr noshade>
Horizontale ruler zonder schaduw effect |
|
| Tabellen |
<table></table>
Creëert een tabel |
<tr></tr>
Rij in een tabel |
<td></td>
Cel in een rij van een tabel |
<th></th>
Zet de tabel hoofdingen (een gewone cel met vette, gecentreerde
tekst) |
|
Tabel
Attributen |
<table border=#>
De dikte van de rand rond een tabel |
<table cellspacing=#>
Spatie tussen de verschillende cellen |
<table cellpadding=#>
Spatie tussen de rand van de cel en haar content |
<table width=# or %>
Tabelbreedte - in procenten of absolute waarden |
<tr align=?> or <td align=?>
Alignering van de content binnen de cellen ('left', 'center',
of 'right') |
<tr valign=?> or <td valign=?>
Vertikale alignering van de content binnen de cellen ('top',
'middle', of 'bottom') |
<td colspan=#>
Aantal kolommen dat een cel moet overspannen (default=1) |
<td rowspan=#>
Aantal rijen dat een cel moet overspannen (default=1) |
<td nowrap>
Voorkomt het breken van tekst door te kleine cel- of tabelbreedtes |
|
| Frames
|
<frameset></frameset>
Tag in een frame document. Mag ook genest worden binnen andere
framesets |
|
<frameset rows="value,value">
Definieert rijen binnen een frameset met als waarden absolute
nummers of percentages van de hoogte
|
<frameset cols="value,value">
Definieert kolommen binnen een frameset met als waarden absolute
nummers of percentages van de breedte |
<frame>
Definieert een enkle frame binnen een frameset |
<noframes></noframes>
Definieert wat een browser weergeeft die geen frames ondersteunt |
|
| Frame attributen |
<frame src="URL">
Specifieert welk html-document in de frame getoond wordt. |
<frame name="name">
Benoemt de frame zodat die aangesproken kan worden vanuit
andere frames (bijvoorbeeld voor links) |
<frame marginwidth=#>
Definieert de linkse en rechtse marge van een frame |
<frame marginheight=#>
Definieert de boven- en ondermarge van een frame |
|
<frame scrolling=VALUE>
Tonen of verbergen van een scrollbar in een frame. Default
waarde is 'auto', waarbij de scrollbar enkel getoond wordt
wanneer nodig. Andere waarden zijn: 'yes' of 'no'.
|
<frame noresize>
Voorkomt dat de gebruiker een frame kan resizen |
|
| Formulieren
|
<form></form>
Creëert een formulier |
<select multiple name="NAME" size=?></select>
Creëert een menu met scrollbar. 'Size' geeft het aantal menu items aan vanaf wanneer de gebruiker moet scrollen. |
<option>
Onderscheidt elk menu item |
<select name="NAME"></select>
Creëert een dropdown lijst |
<option>
Sets off each menu item |
<textarea name="NAME" cols=40 rows=8></textarea>
Creëert een tekstveld met meerdere lijnen. Columns ('cols') bepalen de breedte, 'rows' de hoogte. |
<input type="checkbox" name="NAME">
Creëert een checkbox. De tekst volgt na de tag. Verschillende opties kunnen geselecteerd worden. |
<input type="radio" name="NAME" value="x">
Creëert een radiobutton. De tekst volgt na de tag. Slechts een optie kan geselecteerd worden. |
<input type=text name="foo" size=20>
Creëert een tekstveld met een lijn. Size bepaalt de breedte van het veld - in karakters. |
<input type="submit" value="NAME">
Creëert een submit of verzend knop.. |
<input type="image" border=0 name="NAME" src="name.gif">
Creëert een beeld met dezelfde functie als een submit of verzend knop. |
<input type="reset">
Creëert een reset knop - wist alle velden van een formulier. |