HTML © Eva von Pepel
* [ HTML-referensbok ] * [ Referensböcker ] *
Inledning, Element, Attribut, Värden, Struktur, Dokumenttyp
HTML är ett enkelt logiskt, strukturellt och hierarkiskt markeringsspråk som används för att kunna presentera elektroniska texter på WWW. Att strukturera betyder att på ett logiskt sätt markera texten i ett dokument med överenskomna markeringsord (eng. tags) så att dess olika komponenter (delar/element) t ex tabeller eller stycken bibehåller en hierarkisk relation till varandra.
M.a.o. textens olika delar, t ex stycken eller tabeller kallas element. Varje element markeras med ett överenskommet markeringsord som talar om att elementet börjar och ett som talar om att elementet slutar. Dessa markeringsord läses av en www-klient som presenterar elementents innehåll, dvs det innehåll som finns mellan markeringsorden i form av tabeller eller stycken. Elementen får inte förekomma hur som helst i dokumentet utan följer en hierarki.
HTML bygger alltså på elementens hierarkisk relation till varandra. Denna hierarki följer ett bestämt familjeträd och fungerar på samma sätt som familjeträdet i vår egen släkt. På toppen står familjens grundare - elementet HTML. Detta element är förälder till två två andra element - elementet HEAD och elementet BODY (HTML innehåller två element: HEAD och BODY). HEAD skapar dokumentets huvuddel och BODY dess kropp. Både HEAD och BODY kan, och i vissa fall måste, innehålla andra element, t ex TITEL eller TABLE.
| HTML (stamfadern) | |
|---|---|
| HEAD (barn till HTML) | BODY (barn till HTML) |
| TITLE (barn till HEAD) | TABLE (barn till BODY) |
Som i vilken annan hierarki som helst måste barn följa sina föräldrar, dvs barn till elementet HEAD kan bara finnas i dokumentets huvud, likaså barn till elementet BODY kan bara finnas i dokumentets kropp.
Ett element är en byggnadsdel (familjemedlem) som används för att strukturera HTML-dokument. Ett stycket är ett element, en tabell är ett annat element. Namn på elementen är för det mesta deras riktiga engelska namn, t ex TABLE för en tabell eller dess förkortningar, t ex P för ett stycke (paragraph). (Mer om element och dess uppdelning nedan)
En tagg är en fysisk markering som talar om för www-klienten när ett element börjar och slutar. Elementens början markeras med en starttagg och slut med en sluttagg. En starttagg börjar med avgränsaren < och slutar med > samt innehåller namn på elementtyp som den markerar. Till sluttaggen lägger man teckent /, t ex:
TABLE - ett element
<TABLE> - en starttagg
</TABLE> - en sluttagg
<elementtyp> - starttagg
</elementtyp> - sluttagg
<HEAD></HEAD>, <BODY></BODY>, <H1></H1>
<HEAD> talar om att fr.o.m. nu kommer huvuddelen och </HEAD> att fr.o.m. nu slutar den. <BODY> markerar början av kroppsdelen och </BODY> slutet. <H1> talar om att nu kommer en första nivås rubrik och </H1> att här slutar den.
Elementet TABLE är ett av de element som skapar dokumentets BODY (kropp). <TABLE> är en tagg som talar om att den information som skrivs mellan <TABLE> och </TABLE> innehåller tabulära data och ska struktureras som tabell.
Många säger tagg när de refererar till element. OBServera att en tagg är INTE samma som ett element. Några taggar är valfria och kan uteslutas. Ändå finns elementet kvar. Till exempel element som HEAD finns alltid i dokumentet även om dess taggar <HEAD></HEAD> utesluts.
Det spelar ingen roll om namn på element skrivs med versaler (TABLE), gemena (table) eller t o m en blandning av båda (tAbLe).
HTML-elementen är uppdelade i två grupper: blockelement och inlineelement.
Som framgår av namnet skapar dessa element strukturella block. Blockelement börjar och slutar en rad, dvs skapar en radbrytning i början och slutet av elementet. Dessa element får befinna sig direkt i elementet BODY och innehåller andra block- eller inlineelement. Exempel på blockelement är P och TABLE.
Dessa element följer blocket/texten och skapar inga radbrytningar, men kan vara i början eller slut av raden de befinner sig på. Elementen för enbart befinna sig i blockelement eller andra inlineelement. Exempel på inlineelement är IMG och EM.
En behållare (container) är ett element med innehåll, det kan vara t ex text eller andra element, och har alltid en start- och en sluttagg. De flesta start- och sluttaggar är obligatoriska. Det finns några undantag då sluttaggar är valfria att använda, till exempel styckets sluttagg </P>. Taggen är inte nödvändig därför att det är underförstått att början på ett nytt stycke eller annat element förutsätter att stycket avslutat. Även om sluttaggarna är valfria får man gärna använda dem.
HTML är ett hierarkiskt språk. Det betyder att elementen kommer i en viss ordning. Då språket är även logiskt kan man lätt gissa sig fram vilka element kan en specifik behållare innehålla i fall man inte var säker om elementet är block eller inline (inlineelement får inte innehålla blockelement). Till exempel en tabell kan innehålla data (text). Texten kan formateras. Till formateringen av text använder man elementet FONT därför kan en tabell innehålla detta element. Men det är en omöjlighet att infoga en tabell i t ex bokstaven a, därför elementet FONT kan inte innehålla en tabell.
Ett tomt element (empty element) är ett element utan innehåll, t ex en avdelare <HR>. De kan inte innehålla andra element. Tomma element saknar sluttaggar.
Osynliga element är sådana som inte inte syns på kanvas (den del av skärmen på vilken dokument visas), element som finns i dokumentets huvuddel, t ex META eller HEAD
Ersättningselement är sådana element vars innehåll inte finns i själva dokumentet utan "behåller plats" för det innehåll som kommer att laddas/ersättas efter det att dokumentet har begärts. Till exempel elementet IMG hänvisar till en bildfil. Denna hänvisning kommer senare att ersättas med själva bilden.
Nästlagda element är sådana element som kan befinna sig i element av samma typ (kan ha barn av samma typ). Generellt kan inte element innehålla element av samma typ -- ett barn t ex P kan inte innehålla barn av samma typ dvs ett annat P. Det finns dock undantag. Elementet BLOCKQUOTE (citat ur ett annat verk) kan innehålla ett annat BLOCKQUOTE därför att det är fullt möjligt att citera inifrån ett annat citat.
Nedskrivna element (deprecated) är sådana som får stöd i den aktuella versionen av HTML men detta stöd garanteras inte i framtida versioner av HTML.
Borttagna element (obsolete) är sådana som har borttagits ur den aktuella versionen av HTML och deras framtida stöd av www-klienter ej garanteras.
Alla element som finns i HTML 4.0 Transitional men inte i HTML 4.0 är nedskrivna.
Ö = öpningstagg; S = sluttagg; o = obligatorisk, v = valfri, f = förbjuden (saknas)
T = HTML 4.0 Transitional; F = HTML 4.0 Frameset
| Element | Ö | S | 3.2 | 4.0 | T | Beskrivning |
|---|---|---|---|---|---|---|
| A | o | o | x | x | x | anchor; ankare, inline |
| ABBR | o | o | x | x | abbreviation; förkortning, logiska fraser, inline | |
| ACRONYM | o | o | x | x | akronym, logiska fraser, inline | |
| ADDRESS | o | o | x | x | x | adress, kontakt information, block |
| APPLET | o | o | x | x | Java applet, inline, kan dock innehålla block | |
| AREA | o | f | x | x | x | klickbara arean i imagemap (MAP), tom |
| B | o | o | x | x | x | bold, fet stil, fysisk font stil, inline |
| BASE | o | f | x | x | x | dokumentets absoluta adress, HEAD-element |
| BASEFONT | o | f | x | x | basfontstorlek, tom | |
| BDO | o | o | x | x | BiDi over-ride, bidirectional algoritm, ändrar direktion av text | |
| BIG | o | o | x | x | x | fontstorlek, en storlek större än standard, inline |
| BLOCKQUOTE | o | o | x | x | x | längre citat ur andras verk, block |
| BODY | v | v | x | x | x | dokumentkropp, block |
| BR | o | f | x | x | x | break row, radslut, inline |
| BUTTON | o | o | x | x | tryckknapp i form, inline, kan dock innehålla block | |
| CAPTION | o | o | x | x | x | tabellens etikett |
| CENTER | o | o | x | x | centrera, alias för <DIV ALIGN=center>, block | |
| CITE | o | o | x | x | x | citat, logiska fraser, inline |
| CODE | o | o | x | x | x | kod, t ex programkod, logiska fraser, inline |
| COL | o | f | x | x | tabellens kolumn, tom | |
| COLGROUP | o | v | x | x | tabellens kolumngroup | |
| DD | o | v | x | x | x | definition description, post i termlistan (DL), block |
| DEL | o | o | x | x | deleted text, raderad text , block och inline | |
| DFN | o | o | x | x | x | instance definition, termdefinition, logiska fraser., inline |
| DIR | o | o | x | x | directory list, katalog lista, block | |
| DIV | o | o | x | x | x | division, generisk språk och stil behållare, block |
| DL | o | o | x | x | x | definition list, termlista. block |
| DT | o | v | x | x | x | definition term, term i termlistan (DL), block |
| EM | o | o | x | x | x | emphasis, betoning, logiska fraser, inline |
| FIELDSET | o | o | x | x | formulär kontrollgrupp, block | |
| FONT | o | o | x | x | fontändringar, inline | |
| FORM | o | o | x | x | x | formulär, block |
| FRAME | o | f | F | subram i ramar (frames) | ||
| FRAMESET | o | o | F | ramuppdelning (frames) | ||
| H1 - H6 | o | o | x | x | x | rubriker, block |
| HEAD | v | v | x | x | x | dokumenthuvud |
| HR | o | f | x | x | x | horizontal rule, grafisk avdelare, block |
| HTML | v | v | x | x | x | rotelement (stamfadern) |
| I | o | o | x | x | x | italic, kursiv stil, inline |
| IFRAME | o | o | x | inline ram, inline dock kan innehålla block | ||
| IMG | o | f | x | x | x | image, inbäddad bild, tom, inline |
| INPUT | o | f | x | x | x | formulär kontroll, tom, inline |
| INS | o | o | x | x | inserted text, insatt text, block och inline | |
| ISINDEX | o | f | x | x | sökbart dokument, HEAD-element dock kan finnas i BODY | |
| KDB | o | o | x | x | x | keyboard, texten som följer är skriven av användaren, inline |
| LABEL | o | o | x | x | formulär etikett, inline | |
| LEGEND | o | o | x | x | formulär inskrift | |
| LI | o | v | x | x | x | list item, post i UL, OL, DIR och MENU listor, block |
| LINK | o | f | x | x | x | länkar med andra dokument, HEAD-element |
| LISTING | x | borttaget ur HTML 4.0 | ||||
| MAP | o | o | x | x | x | image map, inline, kan dock innehålla block |
| MENU | o | o | x | x | meny lista, block | |
| META | o | f | x | x | x | generisk meta information, HEAD-element |
| NOFRAMES | o | o | F | alternativt innehåll till ramar, block | ||
| NOSCRIPT | o | o | x | x | alternativt innehåll till skripter, block | |
| OBJECT | o | o | x | x | generiskt inbäddat object, inline dock kan innehålla block | |
| OL | o | o | x | x | x | ordered list, numrerad lista, block |
| OPTGROUP | o | o | x | x | formulär gruppval | |
| OPTION | o | f | x | x | x | formulär väljbart val |
| P | o | v | x | x | x | paragraph, stycke, block |
| PARAM | o | f | x | x | x | parameter, namngivet attribut värde för APPLET & OBJECT |
| PRE | o | o | x | x | x | preformatted text, block |
| Q | o | o | x | x | quotation, kort inline citat, inline | |
| S | o | o | x | strike-through, överstruken text, inline | ||
| SAMP | o | o | x | x | x | sample, exempel output, inline |
| SCRIPT | o | o | x | x | x | skript, HEAD-element, kan finnas i BODY som inline & block |
| SELECT | o | o | x | x | x | OPTION:s väljare, inline |
| SMALL | o | o | x | x | x | fontstorlek, en storlek mindre än standard, inline |
| SPAN | o | o | x | x | generisk språk och stil behållare, inline | |
| STRIKE | o | o | x | x | strike-through, överstruken text, inline | |
| STRONG | o | o | x | x | x | strong emphasis, stark betoning, logiska fraser, inline |
| STYLE | o | o | x | x | x | stil information, HEAD-element |
| SUB | o | o | x | x | x | subscript, nedsänkt text, inline |
| SUP | o | o | x | x | x | superscript, upphöjd text, inline |
| TABLE | o | o | x | x | x | tabell, block |
| TBODY | v | v | x | x | tabellens kropp, block | |
| TD | o | v | x | x | x | tabellens datacell, block |
| TEXTAREA | o | o | x | x | x | formulär textfält, inline |
| TFOOT | o | v | x | x | tabellens fotnot, block | |
| TH | o | v | x | x | x | tabellens rubrikcell, block |
| THEAD | o | v | x | x | tabellens huvud, block | |
| TITLE | o | o | x | x | x | dokument titel, HEAD-element |
| TR | o | v | x | x | x | tabellens rad, block |
| TT | o | o | x | x | x | teletype, proportionella fonter, inline |
| U | o | o | x | x | underlined, understruken text, inline | |
| UL | o | o | x | x | x | unordered list, punkt lista, block |
| VAR | o | o | x | x | x | variable, variabel, inline |
| XMP | x | borttaget ur HTML 4.0 |