Učení HTML část 4: Jak vytvořit název (nadpis) v HTML
Tentokrát vysvětlím jakvytvořit nadpisy v HTML. Při vytváření dokumentu HTML se doporučuje přidat do dokumentu nadpisy. Nadpis je soubor frází nebo slov, které se v dokumentu HTML stávají titulem nebo titulky.
Udělení titulu je určitě velmi důležitéposkytnout přehled diskurzu nebo článku v dokumentu HTML. Nadpisy nejsou názvy (názvy v dokumentu HTML), které se zobrazují jako nadpisy dokumentů HTML v záhlaví, ale nadpisy se v obsahu dokumentu objevují jako nadpis diskurzu nebo textu.
HTML poskytuje 6 úrovní nadpisů různých velikostí. Použití značky nadpisu začíná značkou <Hx> a končí značkou </Hx> kde x je číslo úrovně nadpisu od 1 do 6, kdečím větší je hodnota x, tím menší je velikost záhlaví. Čím je však hodnota x menší, tím vyšší je úroveň důležitosti názvu jinými slovy h1 má důležitější pozici než h6 a tak dále.
V záhlaví je doprovodný atribut ALIGN což umožňuje zobrazení nadpisů rovně, vlevo nebo uprostřed. Následuje tabulka hodnot atributů ALIGN v záhlaví:
Hodnota | Funkce |
Vlevo | Zarovnání nadpisu doleva |
Správně | Zarovnání nadpisu doprava |
Centrum | Zarovnání záhlaví na střed |
Pro více informací zde je kód pro použití nadpisů:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Headings Di HTML</title>
</head>
<body>
<h1 align="left"> Heading 1</h1>
<h2 align="left"> Heading 2</h2>
<h3 align="left"> Heading 3</h3>
<h4 align="left"> Heading 4</h4>
<h5 align="left"> Heading 5</h5>
<h6 align="left"> Heading 6</h6>
</body>
</html>
Po spuštění kódu HTML výše budou výsledky vypadat jako na obrázku níže:
Obrázek nahoře jasně ukazuje rozdíl ve velikosti každé úrovně nadpisu od 1 do 6. Poté je třeba zapamatovat použití atributů zarovnat nadpis není podporován HTML5, protože byl nahrazen použitím CSS. Níže jsou uvedeny výchozí hodnoty od h1 do h6 v CSS, které prohlížeč obvykle zobrazuje:
H1 | H2 | H3 |
displej: blok; velikost písma: 2em; okraj: 0,67em; margin-bottom: 0.67em; levý okraj: 0; pravý okraj: 0; font-weight: bold; |
displej: blok; velikost písma: 1,5em; okraj: 0,83em; margin-bottom: 0,83em; levý okraj: 0; pravý okraj: 0; font-weight: bold; |
displej: blok; velikost písma: 1,17em; margin-top: 1em; margin-bottom: 1em; levý okraj: 0; pravý okraj: 0; font-weight: bold; |
H4 | H5 | H6 |
displej: blok; velikost písma: 1em; okraj: 1,33em; margin-bottom: 1,33em; levý okraj: 0; pravý okraj: 0; font-weight: bold; |
displej: blok; velikost písma: 0,83em; okraj: 1,67em; margin-bottom: 1,67em; levý okraj: 0; pravý okraj: 0; font-weight: bold; |
displej: blok; velikost písma: .67em; okraj: 2,33em; margin-bottom: 2,33em; levý okraj: 0; pravý okraj: 0; font-weight: bold; |
Vodorovná dělicí čára (značka <hr>)
Další je použití značky <hr>. Značku <hr> můžete použít k vytvoření vodorovných dělicích čar v dokumentech HTML. Značka <hr> ve výchozím nastavení vytvoří řádky podél okna prohlížeče. Ve značce <hr> je také několik atributů:
Atribut | Funkce |
Zarovnat | Pro zarovnávání linií, ať už plochých, středních nebo pravých |
Velikost | Nastavte tloušťku čáry na hodnotu pixelu |
Noshade | Zobrazuje čáry bez 3D stínů |
Barva | Dejte linii barvu |
Šířka | Nastavte šířku čáry s hodnotami v pixelech nebo procentech |
Následuje příklad použití značky <hr>:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Garis Pemisah Horizontal Di HTML</title>
</head>
<body>
<h1 align="left"> Heading 1</h1>
<hr color="green" width="20%" size=3 align="left" >
<h4 align="left"> Heading 4</h4>
</body>
</html>
Po zobrazení v prohlížeči budou výsledky vypadat níže.
V nastavení šířky značky <hr> můžetepomocí px nebo procent (%). Ve výše uvedeném příkladu používám procento (%) jinými slovy, šířka je 20% šířky okna prohlížeče. Pokud tedy uděláte 100%, bude značka <hr> stejně široká jako okno prohlížeče.
Potom jsou atributy ve značce <hr>výše uvedené není podporováno HTML5, protože jeho funkce byla nahrazena použitím CSS. Také v HTML 4.01 je značka <hr> definována jako vodorovná čára, ale v HTML5 je definována jako tematická přestávka, jako je změna v tématu diskursu, změny v linii příběhu atd.
V dalším článku se můžete setkats některými značkami HTML, které HTML5 nepodporuje. Přesto to ještě vysvětlím, abyste věděli o funkci těchto značek. Dále se dozvíme, jak udělat odstavce v HTML.