HTML HTML. Základní struktura. HyperText Markup Language

HTML
DOWNLOAD

Rozměr: px

Začít zobrazení ze stránky:

Download "HTML HTML. Základní struktura. HyperText Markup Language"

Pavel Sedlák
před 8 lety
Počet zobrazení:

1 HTML <!DOCTYPEHTMLPUBLIC"/W3C/DTDHTML4.01/EN" "htp:/ẇw3ọrg/tr/html4/stricṫdtd"> <HTML><HEAD><TITLE>MyfirstHTMLdocument TITLE> BODY><P>Heloworld! HEAD> < HTML> HyperText Markup Language současná verze: 4.01 W3C Recommendation aplikace jazyka SGML HTML Základní struktura HTML kořenový element HEAD hlavička BODY tělo Varianty Strict: bez prezentačních elementů a atributů Transitional: včetně prezentačních elementů a atributů Frameset: shodné s Transitional až na obsah elementu HTML, kde je BODY nahrazeno elementem FRAMESET

2 TITLE titulek META metainformace name content http-equiv <metahtp6equiv="content6type" content="text/html;charset=utf68"> <metaname="author"content="ondřejkučera"> HEAD LINK vztah k jinému dokumentu BASE výchozí cesta STYLE styly SCRIPT scripty Společné atributy title titulek id unikátní identifikátor v dokumentu class třída lang jazyk dir směr psaní (ltr rtl) style styl šest úrovní H1, H2, H3, H4, H5, H6 Nadpisy Psaní textu EM zdůraznění STRONG výraznější zdůraznění CITE citace DFN definice (pojmu) CODE fragment počítačového kódu SAMP ukázka výstupu počítačového programu KBD vstup od uživatele VAR proměnná nebo argument ABBR zkratka ACRONYM zkratkové slovo

3 Psaní textu Q citace, inline cite (URI) zdroj BLOCKQUOTE citace, bloková cite (URI) zdroj SUB dolní index SUP horní index Psaní textu P odstavec nesmí obsahovat žádný blokový element BR odřádkování v rámci odstavce clear PRE předformátovaný text INS vložený text, DEL smazaný text cite (URI) zdroj vysvětlující důvod změny datetime doba změny smějí být použity jako blokové i jako inline, ovšem jsou-li použity jako inline, nesmějí obsahovat blokový element. Psaní textu CENTER TT, I, B, BIG, SMALL, STRIKE, S, U FONT, BASEFONT HR (horizontální čára) Seznamy UL neuspořádaný seznam type, compact OL uspořádaný seznam type, start, compact LI položka seznamu value

4 Vnořené seznamy Obvyklý postup instalace programu ze zdrojových kódů pro změnu umístění použij např. při typické instalaci je potřeba pouštět jako root ice620make zvažn pracovat,./configure6prefix usr rozumně zároveň chceš systémem se m akeinstal 3.m akepokud Seznamy definic dl> Another application of DL, for example, is for marking up dialogues, with each DT naming a speaker, and each DD containing his or her words. d>youngexcitablepersonwhomaymature intoa<em>nerd em>or<em>gek em> d> d>technicalybrightbutsocialyineptperson d> d>acleverprogramer d> <dl><dt>dweb dt> <dt>hacker dt> <dt>nerd dt> < Vnořené seznamy Obvyklýpostupinstalaceprogramuzezdrojovýchkódů <ol><li><code>./configure code> ul><li>prozměnumístěnípoužijnapř. <br <code>./configuresprefix usr code> li> ul><li>pokudsesystémemchcešzároveňrozumněpracovat, ul><li>přitypickéinstalacijepotřebapouštětjakorot li> zvaž<code>nices20make code> li> ul> li><li><code>make code> ul> li><li><code>makeinstal code> < ul> li> ol> Seznamy definic DL seznam definic DT termín DD popis

5 DIR MENU Seznamy Tabulky TABLE tabulka - - (CAPTION?, (COL* COLGROUP*), THEAD?, TFOOT?, TBODY+) summary (shrnutí; především pro nevizuální prohlížeče) width (šířka) border (okraj), frame, rules cellspacing (prostor mezi buňkami) cellpadding (odsazení obsahu buňky) CAPTION popis tabulky Tabulky THEAD hlavička tabulky - O (TR)+ align (left center right justify char) char charoff ( specifies the offset to the first occurrence of the alignment character on each line ) valign (top middle bottom baseline) TFOOT patičcka tabulky - O (TR)+ TBODY tělo tabulky O O (TR)+ Tabulky COLGROUP skupina sloupců - O (COL)* span (počet sloupců ve skupině) width (šířka každého sloupce ve skupině) COL sloupec - O EMPTY span, width

6 Tabulky The COL element allows authors to group together attribute specifications for table columns. The COL does not group columns together structurally that is the role of the COLGROUP element. COL elements are empty and serve only as a support for attributes. They may appear inside or outside an explicit column group (i.e., COLGROUP element). Tabulky TR řádek TH nadpis rowspan, colspan abbr (zkrácená forma obsahu buňky) scope (row col rowgroup colgroup) axis (logická kategorie, do které buňka spadá) headers TD buňka rowspan, colspan, abbr, axis, scope headers (seznam nadpisů pro tuto buňku) Odkazy A odkaz (kotva) name (vytváří cílovou kotvu odkazu) href (určuje cílovou kotvu odkazu) hreflang (jazyk odkazu) type (MIME type odkazu) rel (vztah současného dokumentu k odkazu) rev (vztah odkazu k současnému) charset (kódování znaků použité v odkazovaném dokumentu) shape, coords, target, tabindex, accesskey LINK odkaz (vztah k jinému dokumentu) charset, href, hreflang, type, rel, rev media (média) BASE výchozí cesta nebo cíl href, target Obrázky IMG obrázek src (adresa) alt (krátký popis) longdesc (dlouhý popis) align, width, height, border, hspace, vspace ismap, usemap

7 Objekty <p><!6firstțrythepythonaplet6> <objectitle="theearthasenfromspace" clasid="htp:/ẇobserveṙmars/theeartḣpy"> <objectdata="theeartḣmpeg"type="aplication/mpeg"> <objectdata="theeartḣgif"type="image/gif"> The<strong>Earth strong>asenfromspacė <!6ElsețrytheMPEGvideo6> <!6ElsețrytheGIFimage6> <!6Elserenderthetext6> object> object> Objekty OBJECT objekt data (adresa dat objektu) type (MIME type dat) classid, codebase, codetype, archive, declare, standby align, width, height, border, hspace, vspace usemap PARAM parametr objektu name (název) value (hodnota) valuetype (data ref object) type (MIME type pro případ ref) APPLET applet codebase, code, name, archive, object, width, height, alt, align, hspace, vspace Obrázkové mapy Obrázkové mapy MAP mapa name (název) AREA oblast shape (default rect circle poly) coords (souřadnice) nohref (není odkazem) alt, href, target, tabindex, accesskey <p><objectdata="navbar1.gif"type="image/gif"usemap="#map1"> ords="276,0,276,28,10,20,50,50,276,0"> <p>thisisanavigationbaṙ object> mapname="map1"> areahref="guidėhtml" lt="acesguide" < a hape="rect" ords="0,0,18,28"> areahref="searcḣhtml" sc lt="search" hape="rect" ords="184,0,276,28"> areahref="shortcuṫhtml" < lt="go" hape="circle" ords="184,20,60"> areahref="top10ḥtml" lt="topten" a hape="poly" sc map>

8 Rámy FRAMESET rozložení rámů rows (horizontální rozložení rámů) cols (vertikální rozložení rámů) FRAME rám name (název) src (umístění obsahu rámu) noresize (rámu nelze měnit velikost) scrolling (auto yes no) frameborder (1 0) marginwidth, marginheight, longdesc NOFRAMES alternativní obsah Rámy Obrázkové mapy na serveru ttp:// IFRAME inline rám width, height, src, name, longdesc frameborder, marginwidth, marginheight, scrolling, align <ahref="htp:/ẇacmėcom/cgiábin/competition"> a>h<imgsrc="gamėgif"ismapalt="target"> Rámy <!DOCTYPEHTMLPUBLIC"s/W3C/DTDHTML4.01Frameset/EN" <ul><li><ahref="contents_of_frame1ḥtml">someneatcontents a> <li><imgsrc="contents_of_frame2.gif"alt="aneatimage"> <li><ahref="contents_of_frame3ḥtml">someotherneatcontents a> "htp:/ẇw3ọrg/tr/html4/frameseṫdtd"> <html><head><title>asimpleframesetdocument title> framesrc="contents_of_frame1ḥtml"> <framesrc="contents_of_frame2.gif"> framesrc="contents_of_frame3ḥtml"> head><framesetcols="20%,80%"> framesetrows="10,20"> p>thisframesetdocumentcontains: frameset> <noframes> < ul> noframes> frameset> html>

9 Formuláře FORM formulář action (adresa) method (get post) enctype (MIME type pro případ metody post) accept-charset (seznam kódování, která server přijímá) accept (seznam MIME typů, která server přijímá) name, target Formuláře INPUT formulářový vstup type (text password checkbox radio submit reset file hidden image button) name (název) value (úvodní hodnota) size (velikost) maxlength (maximální délka vstupu) checked, readonly, disabled src (adresa) alt, align, accept, tabindex, accesskey, usemap, ismap BUTTON tlačítko type (submit reset button) name, value, disabled, tabindex, accesskey Formuláře SELECT menu multiple (dovoluje vybrat více položek) size (množství najednou viditelných položek) name, disabled, tabindex OPTGROUP skupina voleb label (popis) disabled OPTION volba selected (předvybráno) value, label, disabled Formuláře TEXTAREA víceřádkový vstup rows (počet řádků) cols (počet sloupců) name, readonly, disabled, tabindex ISINDEX jednořádkový vstup LABEL popis for (id prvku, ke kterému se vztahuje) accesskey, tabindex FIELDSET skupina formulářových prvků LEGEND nadpis skupiny align, accesskey

10 Styly STYLE styl type (MIME type) media (screen tty tv projection handheld print braille aural all) title Scripty SCRIPT script src (adresa) type (MIME type) charset (kódování scriptu) defer (script negeneruje žádnou část dokumentu) NOSCRIPT alternativní obsah Události onload, onunload, onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onfocus, onblur, onkeypress, onkeydown, onkeyup, onsubmit, onreset, onselect, onchange Nesémantické kontejnery SPAN řádkový DIV blokový především v souvislosti se stylováním XHTML aplikace jazyka XML XHTML 1.0 W3C Recommendation , revisited XHTML Basic 1.0 W3C Recommendation W3C Working Draft XHTML Modularization 1.0 W3C Recommendation W3C Working Draft XHTML 1.1 First edition W3C Recommendation Second edition W3C Working Draft XHTML 2.0 W3C Working Draft

11 Odkazy a literatura Odkazy W3C HTML Home Page Jak psát web W3C Markup Validation Service Literatura???

Podobné dokumenty

HTML. HyperText Markup Language. 25.9.2013 Josef Steinberger

HTML. HyperText Markup Language. 25.9.2013 Josef Steinberger HTML HyperText Markup Language 25.9.2013 Josef Steinberger HTML historie, verze Hypertext Jazyk popisující strukturu dokumentu SGML/XML Aplikace Verze: HTML 1 1990+ TBL, CERN HTML 2.0 1995 as RFC 1866