Požadované značky. Struktura dokumentu HTML. Základy HTML
Tagy
Příkazy prohlížeče, které vám říkají, jak zobrazit text, vložit tabulky, obrázky a další objekty, se nazývají tagy ( z angličtinyštítek- štítek, znak). Samotné značky (příkazy) se na obrazovce nezobrazují.
Název značky je napsán například v trojúhelníkových závorkách – značka, která prohlížeči říká, aby veškerý následující text napsal tučně. Název značky může být zapsán v libovolném případě (velká nebo malá písmena), to znamená, že jej prohlížeč interpretuje stejným způsobem jako .
Tagy lze spárovat nebo nepárovat. Značka například říká prohlížeči, aby veškerý následující text až po příkaz napsal tučně. V tomto případě se tag zadávající příkaz nazývá otevření a tag rušící příkaz se nazývá uzavření.
Tagy mohou mít parametry (nebo atributy). Chcete-li například nastavit barvu písma, použijete značku písma s parametrem color: – jedná se o úvodní značku, která prohlížeči říká, aby zobrazoval písmo jako zelené (v tomto příkladu) až do závěrečné značky.
Některé parametry vyžadují povinnou specifikaci jejich hodnot. Pro některá nastavení používá prohlížeč výchozí hodnoty, pokud nejsou zadány jiné hodnoty.
Pokud má tag několik parametrů, pak se zapisují oddělené mezerou v libovolném pořadí. Například: - dvě podobné položky úvodní značky písma s parametry barvy a velikosti.
Struktura HTML stránek
Každá stránka HTML musí obsahovat následující povinné značky:
html - sděluje prohlížeči, že stránka je napsána v HTML a řádky až po závěrečnou značku tvoří jeden dokument;
hlava - důležité informace popisující tento dokument jsou umístěny mezi otevírací a zavírací značkou;
tělo - obsah stránky je umístěn mezi otevírací a zavírací tag.
Dokument HTML má tedy následující strukturu:
Popis dokumentu (nezobrazuje se na samotné stránce)
Obsah (zobrazený na stránce s ohledem na zadané označení)
Samotná sekce je volitelná a slouží k tomu, aby obsahovala popis dokumentu. Je-li přítomen, pak jedinou požadovanou značkou je TITLE, jejíž obsah určuje název dokumentu, obvykle se zobrazuje v nadpisu okna prohlížeče.
Například tento řádek 1_HTML nastaví název dokumentu „1_HTML“, který se v Mozilla Firefox projeví v názvu okna a na záložkách (když je otevřeno několik stránek):
2. Formátování textuPísma: typ písma, velikost, barva
Textová dekorace
Nadpisy
Značky pro zalomení řádku a formátování odstavce
Zarovnání textu
Cvičení
Pomocí značek HTML můžete psát text v různých stylech (druhech písma), velikostech a barvách. K tomu použijte značku, která má několik parametrů:
obličej – pro nastavení náhlavní soupravy,
velikost – pro nastavení velikosti,
barva – pro nastavení barvy.
Chcete-li nastavit požadované písmo, velikost nebo barvu, musíte odpovídajícímu parametru přiřadit požadovanou hodnotu:
parametr="hodnota"
Sluchátka
Chcete-li například napsat text písmem Times New Roman, musíte před požadovaný text vložit značku a přiřadit jeho parametru face hodnotu Times New Roman a od tag je pár, pak za požadovaný text musíte vložit uzavírací tag:
Text ve stylu Times New Roman
Text ve stylu Times New Roman
Parametru face lze přiřadit více hodnot oddělených čárkami:
face="Times New Roman, Times, patka"
V tomto případě se prohlížeč nejprve pokusí zobrazit text ve fontu Times New Roman. Pokud takové písmo není na počítači uživatele dostupné, prohlížeč se pokusí zobrazit text ve fontu Times atp.
Velikost
Chcete-li napsat text o velikosti 4, musíte před požadovaný text vložit značku a nastavit její parametr velikosti na 4:
Velikost textu 4
V důsledku toho prohlížeč zobrazí tento řádek takto:
Velikost textu 4
Co znamená toto záhadné číslo 4? Parametr size může nabývat hodnot od 1 do 7. Jedná se o konvenční jednotky. Výchozí střední velikost je size="3" .
Velikost textu 4 je tedy průměrná velikost zvětšená o 1 konvenční jednotku a velikost textu 2 je průměrná velikost zmenšená o 1 konvenční jednotku atd. Velikost takto zadaného textu se nazývá absolutní.
Existuje však další způsob, jak zmenšit nebo zvětšit velikost textu vzhledem k výchozí velikosti. Chcete-li to provést, musíte parametru velikosti přiřadit hodnotu "-1" nebo "+1". Při tomto způsobu nastavení velikosti se velikost textu nazývá relativní.
Chcete-li získat velikost textu 5, můžete použít dvě metody:
Velikost textu 5 nebo Velikost textu 5
Kromě těch, které jsou uvedeny, existuje několik dalších způsobů, jak nastavit velikost textu.
Text můžete zvětšit pomocí značky:
Zvětšený text
V důsledku toho prohlížeč zobrazí tento řádek takto:
Zvětšený text
Text můžete zmenšit pomocí značky:
Menší text
V důsledku toho prohlížeč zobrazí tento řádek takto:
Menší text
Tagy a lze několikrát opakovat pro zvýšení efektu. Pokud je výsledkem například řádek:
Velký text
text není dostatečně velký:
Velký text
můžete to napsat takto:
Velký text
A výsledkem bude větší text:
Velký text
Barva
Nyní o nastavení barvy textu. Chcete-li napsat text červeně, musíte před požadovaný text vložit značku a nastavit jeho parametr barvy na červenou:
Červený text
V důsledku toho prohlížeč zobrazí tento řádek takto:
Červený text
Barvu lze ale specifikovat nejen svým názvem, ale také digitální hodnotou v hexadecimálním formátu, která vypadá jako znak # a 6 znaků (číslice 0-9 a písmena latinské abecedy A-F) za ním. Například červená barva odpovídá hexadecimální hodnotě #FF0000 . Tito. Existují dva způsoby, jak napsat text červeně:
Červený text nebo červený text
Zde si můžete stáhnout tabulku barev, která ukazuje hlavní barvy, jejich názvy a jejich odpovídající hexadecimální hodnoty.
Pokusím se vést newsletter podle principu „od jednoduchého ke složitému“. Povedu to přesně v tomto formátu, aby člověk, který by se chtěl naučit základy tvorby webových stránek, mohl ihned po vydání newsletteru uvést prezentovaný materiál do praxe.
Rád bych ale okamžitě učinil výhradu, že zejména jazyk HTML je velmi rozsáhlý jazyk, který se neustále vyvíjí. A proto, abyste tento jazyk zvládli na vysoké úrovni, musíte si pečlivě prostudovat základy (tj. čísla mého newsletteru). A zároveň cvičit.
Až se budeme učit základy HTML, podíváme se na styly CSS. To znamená, že budeme také studovat CSS. Ale to je trochu později. Pro pomoc se také obrátíme na javascript.
Pro dnešní úvodní lekci začneme seznámením se strukturou HTML dokumentu a základními HTML tagy.
Pojďme...
Každý HTML dokument začíná řádkem:
XHTML
|
Obecně tento řádek sděluje prohlížeči, který otevře naši stránku, na jaké standardy by se měl spoléhat.
Tag je velmi různorodý a jeho modifikace určuje, jak se bude obsah na vaší stránce zobrazovat.
Pokud však šikovně uspořádáte všechny prvky a bloky na stránce a použijete styl, bude vše fungovat stejně dobře ve všech prohlížečích s požadovaným .
Zatímco ale nevíme, co jsou bloky, co jsou styly a jak toto „abrucadabra“ aplikovat, považuji za nutné vrátit se k podrobné úvaze, když už něco umíme a dokážeme jeho práci reálně zhodnotit.
Mezitím se přesuneme o stránku dolů.
Mimochodem, proč jsem se začal dívat na HTML dokument z horní části stránky?
Protože prohlížeč načte stránku a „přečte kód“ shora dolů, zleva doprava. (Nicméně stejně jako my čteme knihy).
Možná slovo tag není úplně jasné?
Obecně řečeno, značka je instrukce, která prohlížeči říká, co má v daném bodě dokumentu udělat.
K vytváření našich stránek používáme značky. Všechny značky jsou uzavřeny v takzvaných „rozích“ ( ). A uzavírací (s lomítkem). Například tučný text. Určuje, že text mezi úvodním a závěrečným silným tagem bude tučný.
Doufám, že je jasné, co je značka.
Navrhuji, abyste něco napsali vlastníma rukama.
Pojďme tedy začít.
Spusťte poznámkový blok nebo wordpad v OC WINOWS. Zapišme následující řádky:
XHTML
Název okna prohlížeče
Název okna prohlížeče
|
Uložme soubor pod nějakým názvem, například start.html. Teď pojďme zjistit, co napsali.
Mezi značkami jsou informace, které se na stránce nezobrazují.
Značka mimochodem například nevyžaduje uzavírací značku, může označovat kódování (charset=windows-1251) nebo informace o autorovi (name="author" content="Celé jméno") nebo slova u vyhledávače značka přinutí prohlížeč automaticky přejít na web mysite.ru po 30 sekundách (příklad).
Tag definuje text v záhlaví okna prohlížeče. (Zavírací štítek).
Tag může také obsahovat javascript nebo vbscript skripty uzavřené v tagech …. .
A styly uzavřené ve značkách... .
S touto značkou pravděpodobně skončíme.
Toto je ve skutečnosti tělo dokumentu, vše, co vidíme na stránce, se nachází zde. Tag má sadu parametrů, na které se podíváme, ale nedoporučuje se je používat.
bgcolor - nastavuje barvu pozadí dokumentu. ( )
pozadí - odkazuje na URL obrázku - pozadí dokumentu.
text – nastavuje barvu textu dokumentu.
odkaz - nastavuje barvu hypertextových odkazů.
vlink= - nastaví barvu hypertextových odkazů, které jste již navštívili, pomocí hodnoty.
alink= - Nastaví barvu hypertextových odkazů po kliknutí.
bgproperties=fixed - obrázek na pozadí se nebude posouvat. Tito. text se po stisknutí PageDown posune, ale pozadí ne.
Tato možnost je podporována pouze aplikací Internet Explorer.
Tyto parametry lze kombinovat, například na této stránce se používá:
XHTML
|
Zapišme tento řádek v našem předchozím příkladu.
XHTML