**** HTML tagy a různé zlepšováky ****
______________________________________
______________________________________

sekce HEAD
čeština
písmo, font face!!!
barvy
seznamy
odkazy
rámy
STYLY-ůvod
STYLY-vlastnosti, filtry-efektivni prace s obrazky!!!
STYLY-formátování
mapy
formuláře
tabulky
skripty
hiearchie objektů
objekty
Java-aplety
ISS
ASP
marquee


TVARY URL: HTTP://počítač:port/cesta?dotaz#fragment
	    FTP://uživatel:heslo@počítač:port/cesta;type=d-do adres.,a-txt, i-bin.soubor
	  malito:adresa@doména

ÚVODNÍ ŘÁDEK DOKUMENTU <!Doctype HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
		       <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
                         - umožnuje nové funkce, jako editovat barvu posuvníků...(viz. styly)

KÓDOVÁNÍ speciálních znaků pro URL: lomítko=%2F
	 entit: > = & gt (bez mezery)
		< = & lt
		" = & quot
		& = & amp
		× = & times
		© = & copy


TAGY: <PRE> párový tag, slouží k zobrazení pevně formátovaného textu(řádkování, mezery)
	<ADRESS> párový tag pro vypsání kontaktu na autora; využívají jej různé programy
		 řádky v adrese se ukončují <BR>
	<BR CLEAR=left/right/all> tag pro obtékání obrázků textem
	<DIV> párový tag pro definici vlastností bloku dokumentu; <DIV align=right>...
	<IMG SRC="obr" ALT=popisek WIDTH=x HEIGHT=x ALIGN=L,R,C VALIGN=T,M,B>
	<BGSOUND src=url> - V sekci Vhead> slouží k načtení zvukového souboru
	<MARQUEE DIRECTION=left..> BEHAVIOR=ALTERNATE - vytvoří pohybující se element, behavior aternate-střídání směrů L-R..
 	<marquee behavior=scroll direction=up width=150 height=200 scrollamount=1 scrolldelay=60 onmouseover='this.stop()' onmouseout='this.start()'>
	atribut ACCESKEY lze použít u CAPTION, A, LEGEND (použití viz. formuláře)	
	atribut TARGET - u A, LINK, AREA, FORM





	SEZNAMY: <UL><LI> +type=disc/square/circle /netříděný seznam/
		 <OL><LI> +type=1/I/a/A  /číslovaný seznam/
			  +START=číslo /číslo u první položky/
		 <DL><DT>pojem<DD>definice, vysvětlení pojmu   /definiční seznam/
	



	PÍSMA:   <CITE> označení názvů...
		 <CODE> ukázka kódu nějakého programu..
		 <EM> 	zvýraznění fráze,...
		 <KBD>	vyznačení textu zadávaného uživatelem
		 <SAMP> zápis výstupů z programů a skriptů
		 <STRONG> silné zvýraznění
		 <VAR>	označení proměnných
		 <DFN>	vyznačuje termín, který je definován
		 <B>	tučné
		 <I>	kurzíva
		 <U>	podtržené
		 <TT>	neproporciální písmo
		 <STRIKE> přeškrtnuté
		 <BIG>	větší
		 <SMALL> menší
		 <SUB>	dolní index
		 <SUP>	horní index
		 <BLOCKQUOTE> citát
		 <ACRONYM> - pro zápis zkratek; lze použít i atr. TITLE=plný název zkratky,...
		 <H1>-<H6>
		
		Formátování písma se děje taky <FONT></FONT>
		<font size=1-7> - velikosti písma, 1-nejmenší..7-největší

		NASTAVENI DRUHU PISMA pomci FONT FACE 
		-------------------------------------
	        <FONT FACE="COMIC SANS MS"> 		Ukázka vzhledu písma...
		<FONT FACE="TAHOMA"> 			Ukázka vzhledu písma...
		<FONT FACE="MODERN"> 			Ukázka vzhledu písma...
		<FONT FACE="Tempus Sans ITC"> 		Ukázka vzhledu písma...
		<FONT FACE="Bookman Old Style"> 	Ukázka vzhledu písma...
		<FONT FACE="Courier New"> 		Ukázka vzhledu písma...
		<FONT FACE="Arial"> 			Ukázka vzhledu písma...
		<FONT FACE="Trebuchet MS"> 		Ukázka vzhledu písma...
		<FONT FACE="Lucida Sans Unicode"> 	Ukázka vzhledu písma...
		<FONT FACE="Trebuchet MS"> 		Ukázka vzhledu písma...
		<FONT FACE="Trebuchet MS"> 		Ukázka vzhledu písma...
		<FONT FACE="Trebuchet MS"> 		Ukázka vzhledu písma...





Barvy







Barva                       RedGreenBlueUKÁZKA:

aliceblue	F0F8FFText

antiquewhite	FAEBD7Text

aqua		00FFFFText

aquamarine	7FFFD4Text

azure		F0FFFFText

beige		F5F5DCText

bisque		FFE4C4Text

black		000000Text

blanchedalmond	FFEBCDText

blue		0000FFText

blueviolet	8A2BE2Text

brown		A52A2AText

burlywood	DEB887Text

cadetblue	5F9EA0Text

chartreuse	7FFF00Text

chocolate	D2691EText

coral		FF7F50Text

cornflowerblue	6495EDText

cornsilk		FFF8DCText

crimson		DC14JCText

cyan		00FFFFText

darkblue		00008BText

darkcyan		008B8BText

darkgoldenrod	B8860BText

darkgray		A9A9A9Text

darkgreen	006400Text

darkkhaki	BDB76BText

darkmagenta	8B008BText

darkolivegreen	556B2FText

darkorange	FF8C00Text

darkorchid	9932CCText

darkred		8B0000Text

darksalmon	E9967AText

darkseagreen	8FBC8FText

darkslateblue	483D8BText

darkslategray	2F4F4FText

darkturquoise	00CED1Text

darkviolet	9400D3Text

deeppink		FF1493Text

deepskyblue	00BFFFText

dimgray		696969Text

dodgerblue	1E90FFText

firebrick	B22222Text

floralwhite	FFFAF0Text

forestgreen	228B22Text

fuchsia		FF00FFText

gainsboro	DCDCDCText

ghostwhite	F8F8FFText

gold		FFD700Text

goldenrod	DAA520Text

gray		808080Text

green		008000Text

greenyellow	ADFF2FText

honeydew		F0FFF0Text

hotpink		FF69B4Text

indianred	CD5C5CText

indigo	4B0082Text

ivory		FFFFF0Text

khaki		F0E68CText

lavender		E6E6FAText

lavenderblush	FFF0F5Text

lawngreen	7CFC00Text

lemonchiffon	FFFACDText

lightblue	ADD8E6Text

lightcoral	F08080Text

lightcyan	E0FFFFText

lightgoldenrodyellowFAFAD2Text

lightgreen	90EE90Text

lightgrey	D3D3D3Text

lightpink	FFB6C1Text

lightsalmon	FFA07AText

lightseagreen	20B2AAText

lightskyblue	87CEFAText

lightslategray	778899Text

lightsteelblue	B0C4DEText

lightyellow	FFFFE0Text

lime		00FF00Text

limegreen	32CD32Text

linen		FAF0E6Text

magenta		FF00FFText

maroon		800000Text

mediumaquamarine66CDAAText

mediumblue	0000CDText

mediumorchid	BA55D3Text

mediumpurple	9370DBText

mediumseagreen 3CB371Text

mediumslateblue7B68EEText

mediumspringgreen00FA9AText

mediumturquoise48D1CCText

mediumvioletredC71585Text

midnightblue	191970Text

mintcream	F5FFFAText

mistyrose	FFE4E1Text

moccasin		FFE4B5Text

navajowhite	FFDEADText

navy		000080Text

oldlace		FDF5E6Text

olive		808000Text

olivedrab	6B8E23Text

orange		FFA500Text

orangered	FF4500Text

orchid		DA70D6Text

palegoldenrod	EEE8AAText

palegreen	98FB98Text

paleturquoise	AFEEEEText

palevioletred	DB7093Text

papayawhip	FFEFD5Text

peachpuff	FFDAB9Text

peru		CD853FText

pink		FFC0CBText

plum		DDA0DDText

powderblue	B0E0E6Text

purple		800080Text

red		FF0000Text

rosybrown	BC8F8FText

royalblue	4169E1Text

saddlebrown	8B4513Text

salmon		FA8072Text

sandybrown	F4A460Text

seagreen		2E8B57Text

seashell		FFF5EEText

sienna		A0522DText

silver		C0C0C0Text

skyblue		87CEEBText

slateblue	6A5ACDText

slategray	708090Text

snow		FFFAFAText

springgreen	00FF7FText

steelblue	4682B4Text

tan		D2B48CText

teal		008080Text

thistle		D8BFD8Text

tomato		FF6347Text

turquoise	40E0D0Text

violet		EE82EEText

wheat		F5DEB3Text

white		FFFFFFText

whitesmoke	F5F5F5Text

yellow		FFFF00Text

yellowgreen9ACD32Text





	KLIKACÍ MAPA:
		<MAP NAME=jmeno mapy>
			definice oblastí mapy**
		</MAP>
		
		** <AREA HREF=adresa.html ALT=popis odkazu SHAPE=tvar oblasti COORDS=souřadnice oblasti>
		
		SHAPE=RECT/obdélník/ CIRCLE/kruh/ POLY/mnohoúhelník/
		COORDS-oddělujeme čárkami souřadnice LH roh a PD roh obd, Střed a poloměr kruhu,
			vrcholy rohů mnohoúhelníku
		př.: <Map name=mapa>
			<Area href=kapitola2.html Alt=zpět shape=rect
			coords=11,11,49,49>
			...
			</Map>
		Pak vložit obrázek:<IMG SRC=nazev ALT=popisek USEMAP=#jmeno mapy>



	ODKAZY:	Na část dokumentu-nejdříve určíme sekce dokumentu 
		<A NAME=nazev"> 
		pak odkaz na tuto sekci vypadá:
		<A href="#nazev">nadpis sekce</A>
		
		Odkaz na dokument je podobný:
		<A href="url">odkaz</A>

		Odkazy s určením typu:
		 stejé jako připojení stylů:	<LINK REL=vztah HREF=url>
			kde vztah = 	TOP, START - odkaz na hlavní úroveň
					Contents - odkaz na dokument s obsahem
					Index - na rejstřík	
					Glossary - Slovníček pojmů
					Copyright - stránka s autorskými právy
					Next - další dokument
					Previous - předcházející dokument
					Help - odkaz na stránku o významu a kontextu aktuální stránky
					Search - na stránku umožňující prohledávat skupinu stránek
					StyleSheet - na definici stylu
					Bookmark - odkaz na záložku definovanou v dokumentu
					Alternate -okaz na alternativní verzi dokumentu
					
				př.: <Link rel=contents href=obsah.html" title=obsah>

			Jestliže mezi dokumenty A a B existuje vztah REl=vztah, pak mezi dokumenty B a A
			existuje vztah REV vztah
				př.: <LINK REV=MADE HREF=mailto:zap@atlas.cz>

			Atributy REL, REV a TITLE lze shodně použít i u elementu 




	Hlavička: V sekci head lze umístit tagy - <TITLE>
						- <META NAME="description" CONTENT="Popis firmy...- tento text se zobrazí 
								po vyhledání hesla vyhledávacím strojem, jako popis stránky
								(místo prvních slov ze stránky)>
						- <META NAME="keywords" CONTENT="slova oddělena čárkami, sloužící jako hesla 
								pro vyhledávací stroje>
						- <META NAME=author" CONTENT="Alois Kužela">
Pro správné zobrazení češtiny je vhodné uvést   - <Meta http-equiv="Content-type" Content="text/html;charset=kod">
						kde kod je kódování. Např. Ascii2, windows-1250,ISO 8859-2 (=latin2)...

			Nejčastější kódování:
						US-ASCII (neobsahuje žádné české znaky) 
						ISO-8859-2 (Doporučuji ze všech nejvíce! Čtěte úvahu níže.) 
						cp852 (=PC Latin 2) 
						windows-1250 
						cp1250
						apple-ce ale nevím, zda je řádně registrováno; objevuje se rovněž x-mac-ce (neregistrováno) 
						CSN_369103 (=KOI8-ČS, neužívá se snad už vůbec nikde) 


	TABULKY: <TABLE> + atributy: 	BORDER=šířka rámečku kolem tabulky
					CELLPADDING=x - vzdálenost obsahu buňky od okrajů
					CELLSPACING=x - vzdálenost jednotlivých buňek
					WIDTH, HEIGHT=x, x% - rozměry tabulky
					ALIGN=left, right, center			
					COLS, ROWS - počet sloupců, řádků
		 			RULES=NONE, ROWS, COLS, ALL - zobr. mřížky - žádná, mezi řádky, mezi sloupci, úplná
					FRAME=VOID, ABOVE, BELLOW, HSIDES, VSIDES, LHS, RHS, BOX, BORDER - vzhled rámečku -
						-bez rám., na horní, dolní straně tab., na horní a dolní, na pravé a levé, na levé, pravé, okolo celé, okolo celé
					COLSPEC - šířka a zarovnání jednotlivých sloupců (colspec="L10 C30 R50")
		 <CAPTION> Nadpis tabulky
		 <TR> - řádka tabulky
		 <TH> - buňka se záhlavím tabulky (tučné písmo+centrování)
		 <TD> - obyčejná buňka tabulky
		 Zarovnání pomocí atributů: ALIGN=LEFT,RIGHT, CENTER(horizontální zarovnání)
					    VALIGN=TOP, BOTTOM,MIDDLE(vertikální)
		 Slučování buňek: COLSPAN=x - počet sloučených buňek v řádku
				  ROWSPAN=y - počet sloučených buňek ve sloupci
		
		 Velikost buňek: HEIGHT - výška buňky
				 WEIGHT - šířka buňky
				 NOWRAP - text se nezalomí do více řádků

		Pozadí: atributem BGCOLOR

		 U HTML 4.0 jsou tabulky rozšířeny o členění na:
		 	<THEAD> - záhlavý
			<TFOOT> - pata
			<TBODY> - tělo tabulky (v tomto pořadí(pata před tělem))
			(při rolování dlouhých tabulek pak vidíme nadpisy sloupců...)
			
			Ihned pod elementem <TABLE> lze definovat skupiny sloupců pomocí:
			<COLGROUP> - párový tag odděluje skupinu sloupců
			Př.: <COLGROUP SPAN=3 width="0*" ALIGN=center> - 3 sloupce mají min.šířku a jsou 
								    centrovány
				</colgroup>
				<COLGROUP><COL WIDTH=200> - sloupec široký 200
				<COL WIDTH="0*"> - sloupec s min. šířkou
				<COLGROUP SPAN=2 WIDTH=50> - 2 sloupce široké 50
				</colgroup></colgroup>
			-pokud SPAN=0 přiřadí se vlastnost na zbývající sloupce
			
			 Pro <TD> a <TH> existuje značení buňek:
				AXIS - def. jméno buňky
				AXES - Seznam jmen, se kterými buňka souvisí
			 - vhodné pro převod do databázové tabulky(jinak má buňka jméno svého obsahu)
			 Př.:	<Table>
				<TR><TH>Jméno<TH>Spotřeba>
				<TR><TD AXIS="Novák" AXES="Jméno">Karel Novák<TD>5
				</TABLE>
	
			Zarovnání - vertikální: VALIGN=TOP, MIDDLE, BOTTOM, BASELINE
				  - horizontální: ALIGN=JUSTIFY(do bloku), CHAR(na znak)
				př.: <COLGROUP SPAN=1 ALIGN=CHAR CHAR="," CHAROFF="50%">
					-zarovnání sloupce podle desetinné čárky a v poloviněbuňky 
				(charoff=vzd. od levého okraje)

		!!! Při zápisu tabulek se mezery před obsahy buňek ignorují. Můžeme tak vytvořit přehledný
			zápis zdroj. kódu do sloupečků, což usnadní orientaci, při editaci tabulky.!!!

	

	RÁMY:	dělí okno prohlížeče na několik částí, do nichž je možno načíst různé dokumenty
		stránka s definicí rámů musí obsahovat - záhlaví <HEAD>			
						       - def.rámů <FRAMESET>
		sekce <BODY> je nepovinná a zobrazuje se u prohlížečů nepodporujících rámy
		<FRAMESET ROWS="100,*,3*" COLS="50%,50%"></FRAMESET> - vytvoří 6 rámů
		
		<FRAMESET ROWS="100,*,>
		<FRAMESET COLS="50%,50%"></FRAMESET></frameset> - vytvoří 3 rámy
		Atributy: FRAMEBORDER=x, BORDER=true/false, FRAMESPACING=x - vzdálenost rámů - pro doladění 
			  zobrazení při frameborder=0
		samotný obsah rámů se určí pomocí tagu: 
		<FRAME SRC=URL dokumentu>
		 důležitý je atribut NAME=jméno rámu pro zobrazování dok. z odkazů do vybraných rámů		
		 další atributy: NORESIZE - zakazuje roztažení rámu myší
				 SCROLLING=YES, NO, AUTO - možnost skrolování dokumentu v rámu
				 FRAMEBORDER=x - šířka obrysu rámu
				 MARGINHEIGHT, MARGINWIDTH - vzdálenost obsahu od okraje rámu
		
		Určení rámu v odkazech:
			<A href=URL TARGET=jmenoRamu>
			základní rám lze nastavit v <BASE TARGET> v hlavě HTML
			
			TARGET ma předdefinované čtyři jména:
			 	_blank - dokument se zobrazí v novém nepojmenovaném okně
				_self - ve stejném okně
				_parent - v okně či rámu s nejbližším nadřazeným elementem <FRAMESET>
				_top - do celého okna prohlížeče a rámy se ruší
		
		<NOFRAMES>

		

	
	FORMULÁŘE: zápis - <FORM ACTION="url obslužného CGI-skriptu nebo MAILTO:" METHOR="GET, POST">
			    elementy formuláře
			    </form>
			 
			Elementy: INPUT - slouží k vytvoření vstupních prvků
					atr.:TYPE=TEXT, PASSWORD, CHECKBOX, RADIO, SUBMIT, RESET, IMAGE, FILE, HIDDEN
									  
						Text: vytvoří vstupní pole
						 Atr.:  MAXLENGTH-max. délka textu
							SIZE - velikost vstup. pole
							VALUE - počáteční hodnota
							NAME - jméno pole
				  		Password: stejné jako text, ale zobrazuje *****
						Checkbox: zaškrkávací pole
							NAME, VALUE, CHECKED
						Radio: přepínací tlačítko 
							NAME je stejné pro všechny položky
							VALUE je rozdílné
							jedna musí být CHECKED
						Submit: odeslání formuláře
							VALUE=popis tlačítka
						Reset: Vynulování formuláře
						Image: k odeslání, místo textu je na tlačítku obrázek
							NAME, SRC
						File: odeslání souboru
							SIZE, MAXLENGTH
							ACCEPT - určení MIME povolených souborů
								image/* - obrázek
								text/plain - obr. z ASCII znaků
						
						Hidden: skrytá pole se nezobrazí, ale slouží k uchování stavové informace,
							která je odeslána spolu s formulářem
		
					Po odeslání je tvar:Name1=Value1&Name2=value2&...
		 
	
			SELECT: Výběr ze seznamu vlastností
				atr.: NAME(povinné), SIZE(počet najednou zobr. řádek), MULTIPLE(povoleno vybrat více položek)
			 položky seznamu se uvádějí jako <OPTION>
							  atr.: VALUE, SELECTED(primárně vybráno)
			
			TEXTAREA - víceřádkový text
				- NAME, ROWS, COLS
		u HTML 4.0 lze použít také elementy: LABEL, FIELDSET, LEGEND
			<INPUT TYPE=BUTTON...> - získáme tlačítko, které lze propojit s nějakým skriptem

			<BUTTON type=button, reset, submit...> - stejná funkce jako <input type=...>
			 př.:<BUTTON TYPE=BUTTON onclick="alert("špatné tlačítko")"></button>
			
			<LABEL FOR=jmeno pole ACCESKEY=J> do pole ozn. shodným ID jako FOR např.:
				<INPUT TYPE=TEXT ID=jmeno pole>
					se lze přepnout pomocí klávesy Alt+J

			  atr. TABINDEX=x udává pořadí skoku při stisku Tab


	INLINE RÁMY:	chovají se podobně jako obrázky - v obdélníkovém prostoru se zobrazuje načtený dokument
			<IFRAME SRC=dokument WIDTH HEIGHT FRAMEBORDER SCROLLING>
				Teneto text se zobrazí při nepodporování rámů
			</iframe>
			-nelze použít NORESIZE




	
	STYLY:	zápis jednoduchého stylu:	SELEKTOR {deklarace}  (deklarace=vlastnost:hodnota)
						Př.: H1 {color:blue}
		Výše zapsaný styl se definuje v záhlaví mezi tagy <STYLE> a definici lze uzavřít do komentáře