Jak víte, hlavním obsahem webových stránek je text. S vzácnou výjimkou speciálních galerijních míst. Proto není divu, že HTML má tolik různých ovládacích prvků zobrazení textu.

Ve skutečnosti, abyste mohli zobrazit textový řetězec v okně prohlížeče, nepotřebujete používat žádné značky: Stačí napsat samotný text. Když to ale potřebujete rozdělit alespoň do odstavců, právě zde je potřeba použít značky. Faktem je, že různé počítačové systémy používají různé znaky k rozdělení textu do odstavců a HTML dokumenty by měly být vždy zobrazeny co nejjednotněji na nejrůznějších počítačových platformách. Proto jsme museli zavést značky pro označení odstavců.

Na začátku každého odstavce je značka a na konci závěrečná značka . Tag přitom přirozeně má nějaké parametry. Patří mezi ně nám již známé obecné identifikační parametry třída A id, parametr stylingu styl, na který se podíváme ve druhé kapitole, a parametr zarovnání zarovnat. O posledním parametru bychom si měli popovídat trochu podrobněji.

V HTML termín „zarovnání“ označuje horizontální i vertikální umístění prvku. Ale v případě odstavců textu má smysl mluvit pouze o vodorovném zarovnání nebo, jak se také nazývá, „zarovnání“.

Zarovnání umožňuje přitlačit odstavec k levému nebo pravému okraji výřezu prohlížeče, vycentrovat jej nebo roztáhnout slova tak, aby text rovnoměrně vyplnil celou šířku prostoru, který je mu přidělen. Pro tyto účely se používají hodnoty vlevo, vpravo, uprostřed A ospravedlnit, resp. Zvažme jejich použití na příkladu jiného HTML dokumentu.

Výpis 1.4

Horizontální vyrovnání a63acev

Odstavec přitlačen k levému okraji
Odstavec přitlačen k levému okraji
Odstavec na střed

Odstavec roztažený na šířku

Výsledek prohlížení souboru s takovým kódem pomocí prohlížeče Internet Explorer je na Obr. 1.4. Jak vidíte, poslední odstavec, který měl být podle našeho kódu roztažen na šířku, zobrazuje Internet Explorer stejně jako první. Tento případ může sloužit jako názorná ukázka toho, jak prohlížeče vnímají HTML kód odlišně. V našem případě Internet Explorer jednoduše ignoroval neznámý parametr pomocí standardní možnosti zobrazení.

Rýže. 1.4. Okno prohlížeče zobrazující výsledek souboru uvedeného ve výpisu 1.4

Někdy, aby dále oddělili jeden odstavec od druhého, se tvůrci webových stránek snaží použít prázdné odstavce, to znamená, že mezi značkami začátku a konce odstavce není nic. Podle specifikací by prohlížeče měly takové konstrukce jednoduše ignorovat. Proto k oddělení odstavců nebo vynucení zalomení řádku v rámci jednoho odstavce byste měli použít značku
. Toto je direktivní značka. Jednoduše označí místo, kam je potřeba displej přesunout na jiný řádek. Příklad toho, jak lze tento tag použít k dosažení obou těchto cílů, je uveden v dokumentu HTML, jehož kód je uveden ve výpisu 1.5.

Výpis 1.5

"http://www.w3.org/TR/html4/strict.dtd">
.

Vynucené zalomení řádků


Odstavec, který jsme
Násilně roztrhaný
Další odstavec

Odstavec po nucené přestávce

A jak tento soubor vypadá při jeho prohlížení pomocí prohlížeče je na Obr. 1.5.

Rýže. 1.5. Okno prohlížeče zobrazující výsledek souboru uvedeného ve výpisu 1.5

Štítek
kromě obecných identifikačních parametrů má i parametr Průhledná, který se používá k přesnějšímu zarovnání textu, když se obtéká kolem objektu, jako je grafika vložená do webové stránky. Hodnota tohoto parametru může být jedno ze čtyř předdefinovaných klíčových slov: žádné, vlevo, vpravo, všechny.

Hodnota none je výchozí a označuje, že další řádek bude začínat tam, kde by normálně začínal bez tohoto parametru. Význam vlevo, odjet označuje, že další řádek bude začínat na levém okraji objektu zalomeného textem. Pokud pro tyto účely potřebujete použít pravý okraj, měli byste použít hodnotu že jo. A význam Všechno sděluje prohlížeči, že může používat levý i pravý okraj objektu, pokud je text zobrazen co nejkompaktněji.

Nyní přejděme k úvahám o designu písma textu. V kterémkoli bodě odstavce můžeme použít značku s určitou sadou parametrů, která určí vzhled písma, které bude použito pro zobrazení textu umístěného za touto značkou. Ukončení tohoto tagu se provádí pomocí jeho uzavíracího páru .

Štítek má následující parametry: velikost, používá se k označení velikosti písma, které se má použít, barva- pro nastavení barvy znaků písma a tvář, který označuje, jaké písmo bude použito k zobrazení textu. Podívejme se na tyto parametry.

Jak jsme si právě řekli, parametr size slouží k určení velikosti znaků v použitém písmu. Hodnoty tohoto parametru jsou čísla od jedné do sedmi. Označují určitou relativní velikost znaků. Faktem je, že v HTML nelze nastavit absolutní velikost znaků v bodech, jak jsme zvyklí v běžných kancelářských aplikacích. Uživatel si bude prohlížet webovou stránku na svém počítači a my předem nevíme, jaké fonty může mít nainstalované a jaké velikosti jsou dostupné. Můžeme tedy zadat pouze relativní velikost písma a prohlížeč uživatele sám vybere nejvhodnější velikost.

Jako hodnotu parametru size můžeme určit i změnu velikosti písma. Chcete-li například zvětšit velikost písma o jednu úroveň, použijte následující konstrukci:

A chcete-li zmenšit velikost znaků o dvě úrovně, použijte následující kód:

Pro použití takových struktur je však nutné začít od určité základní velikosti. Pro nastavení této velikosti použijte značku se stejným parametrem velikost. Není-li tato značka použita, bude jako základní velikost znaku použita třetí úroveň. Uveďme si příklad použití těchto značek.

Výpis 1.6.

Velikost symbolu

Styly postav

Text je tučný popř kurzíva

A možná zároveň tučné a kurzíva
Se děje zdůraznil a nepřeškrtnuté.
nebo monospace.
Můžeme zvětšovat a zmenšovat velikost znaků.

Jak můžete vidět z příkladu, můžeme mezi sebou kombinovat různé styly. Měli byste si ale dávat pozor na pořadí, ve kterém značky umísťujete. Otevírací a zavírací značky se musí vnořovat do jiných značek, které byly dříve použity. Příklad toho lze vidět na desátém řádku výpisu. A jak tento HTML dokument vypadá při prohlížení pomocí prohlížeče, ukazuje Obr. 1.7.

Podívali jsme se na způsoby, jakými se nastavují různé parametry zobrazování textu. HTML však poskytuje několik základních způsobů, jak zobrazit text, který není nutné specifikovat celou řadou značek. Mají své vlastní značky, to znamená, že jsou definovány určité kategorie textu, které se zobrazují předdefinovaným způsobem. Všechny tyto kategorie se nejčastěji používají ve vědeckém a počítačovém průmyslu. Pojďme si je vyjmenovat.

• Termín je v textu zvýrazněn pomocí dvojice značek a .
• "Vylepšené" zvýraznění, určené k dalšímu upoutání pozornosti, je vytvořeno pomocí visačky a jejího uzavíracího dvojčete.
• Pomocí značek a je uvedeno, že text umístěný mezi nimi je citací.
• Definice určitého pojmu je zvýrazněna pomocí značek a .
• Dvojice značek se používá ke zvýraznění zdrojového kódu v libovolném programovacím jazyce.
• Výstup textových informací programem je formátován pomocí značek AND.
• Text zadaný uživatelem je označen značkami a . P Proměnné ve zdrojovém kódu programů jsou označeny pomocí dvojice značek a .
• Značky a zvýrazněné zkratky.
• A zavedené kombinace písmen, které nejsou zkratkami, tedy akronymy, jsou zvýrazněny značkami a .

Nestačí však znát názvy značek, musíte také jasně pochopit, jak přesně formátují text. A tady se bez příkladu neobejdete.

Rýže. 1.7. Okno prohlížeče zobrazující výsledek souboru uvedeného ve výpisu 1.7

Výpis 1.8

Standardní možnosti zobrazení

Toto je normální text
Toto je výběr. A výraznější zvýraznění

Výsledek zobrazení takového HTML dokumentu je na Obr. 1.8.

Rýže. 1.8. Okno prohlížeče zobrazující výsledek souboru zobrazeného ve výpisu 1.8

Velmi často je potřeba umístit text na webovou stránku, která byla předem připravena pomocí nějakého textového editoru, který již text nezávisle naformátoval. V tomto případě formát textu, jeho pomlčky a umístění přímo závisí na délce řádku ve znacích, která byla nastavena v tomto textovém editoru. Pokud je text umístěn na webovou stránku konvenčními prostředky, bude toto formátování přirozeně narušeno. Proto byla pro tyto předformátované úryvky zavedena vlastní značka. Tato značka má parametr width, jehož hodnota je délka řádku ve znacích. Přirozeně je vhodné před použitím této značky vynutit přesné písmo, které bylo použito při formátování textu. K vložení předem naformátovaného textu tedy můžeme použít následující fragment kódu:

text.

V tomto příkladu určíme, že text se má zobrazit na základě předpokladu, že řádek má šedesát znaků. V předformátovaném textu však také neplatí pravidla pro „sbalení mezer“. Faktem je, že když prohlížeč narazí na několik po sobě jdoucích mezer v prostém textu webové stránky, sbalí je do jednoho prostoru. Předformátovaný text však neprochází takovou transformací, což mu umožňuje zachovat jeho formátování, které se v nejjednodušších textových editorech provádí pomocí bílých znaků. Mimochodem, v HTML je znak tabulátoru také považován za znak mezery.

Je třeba také poznamenat, že HTML poskytuje možnost používat značky pro zobrazení horních uvozovek, které se obvykle používají ke zvýraznění přímé řeči a některých uvozovek. Citáty jsou opatřeny štítkem s koncovým dvojčetem . A k rámování přímé řeči se obvykle používají značky a. Zároveň tag má parametr cit, jehož hodnota je síťová adresa, nazývaná také URL, internetového zdroje, na kterém byl původně umístěn citovaný text. A společně s tagem se obvykle používá parametr lang, jehož hodnotou je kódové označení jazyka, podle jehož interpunkčních pravidel jsou umístěny omezující uvozovky. Není žádným tajemstvím, že různé jazyky používají různé uvozovky.

Je třeba zmínit i problém převodů. Tvůrci webových stránek na tento problém obvykle ani nepomyslí a prohlížeče se zalamováním slov nezabývají. Pokud se slovo nevejde na řádek, jednoduše se přesune na jiný řádek. Toto ale není jediný správný způsob zobrazení textu. Může nastat situace, kdy potřebujete zobrazit text pomocí dělení slov. HTML poskytuje dva typy pomlček – explicitní a takzvané „měkké“. Explicitní dělení slov se vytváří pomocí znaku pomlčka, který se obvykle nahrazuje numerickými náhradami textu „-“. Explicitní dělení slov je však nepohodlné, protože při změně velikosti okna prohlížeče se může změnit délka řádku, ale značka dělení zůstane stále viditelná. . I když je uprostřed řady. Proto často používají „měkké“ převody. Vytvářejí se pomocí substituce textu "-". V tomto případě nejsou v textu viditelné symboly měkkých pomlček a pouze v případě, že se jakékoli slovo, do kterého byly tyto symboly vloženy, zcela nevejde do řádku, je pomlčeno, rozděleno na slabiky, podle vloženého „ měkké“ pomlčky. A pouze jeden ze symbolů měkkého dělení slov v tomto slově bude viditelný.

HTML také umožňuje zobrazovat horní a dolní indexy pomocí svých značek. Dvojice značek a se používá k vytvoření horního indexu a dolní index musí být obklopen značkami a. Podívejme se na příklad použití těchto značek.

Výpis 1.9

Bepx a dolní indexy

Voda je H20

Jak přesně prohlížeč zobrazuje indexy, ukazuje Obr. 1.9.

Rýže. 1.9. Okno prohlížeče zobrazující výsledek souboru zobrazeného ve výpisu 1.9

Textový design zahrnuje také vodorovné čáry, které často oddělují významné části textového obsahu webových stránek. Do textu dokumentu HTML se pomocí značky vloží řádek. Tag má několik parametrů, které umožňují doladit vzhled vodorovné čáry.

Parametr zarovnání umožňuje určit vodorovné zarovnání čáry. Parametr může mít jednu ze tří přednastavených hodnot: left, right a center, které posunou vodorovnou čáru k levému nebo pravému okraji výřezu, případně ji vycentrují. Výchozí hodnota je střed. Pokud tag obsahuje parametr noshade, pak zobrazená vodorovná čára nebude mít stín. A poslední parametr width umožňuje nastavit délku vodorovné čáry. Výchozí hodnota je "100 %". A výška řádku v pixelech se nastavuje pomocí parametru size. Podívejme se na použití všech těchto parametrů na příkladu.

Výpis 1.10

Toto je ve výchozím nastavení zobrazený normální řádek

Jak takový HTML dokument vypadá při prohlížení pomocí prohlížeče je na Obr. 1.10.

A zde snad můžeme dokončit naše úvahy o možnostech formátování textu, které jsou vlastní HTML.

Rýže. 1.10. Okno prohlížeče zobrazující výsledek souboru zobrazeného ve výpisu 1.10

HTML tagy jsou základem jazyka HTML. Značky se používají k vymezení začátku a konce prvků ve značkách.

Každý HTML dokument se skládá ze stromu HTML prvků a textu. Každý prvek HTML je identifikován počáteční (otvírací) a koncovou (uzavírací) značkou. Úvodní a zavírací tag obsahuje název tagu.

Všechny prvky HTML jsou rozděleny do pěti typů:

• prázdné prvky - , ,
  , , , , , ,
  Slouží k uložení dalších informací o stránce. Tyto informace používají prohlížeče ke zpracování stránky a vyhledávače k ​​jejímu indexování. V bloku může být několik značek, protože v závislosti na použitých atributech nesou různé informace. Ukazatel měření v daném rozsahu. Část dokumentu obsahující navigační odkazy na web. Definuje sekci, která nepodporuje skriptování. Kontejner pro vkládání multimédií (např. audio, video, Java applety, ActiveX, PDF a Flash). Do aktuálního dokumentu HTML můžete také vložit jinou webovou stránku. Tag se používá k předání parametrů pluginu. Objednaný číslovaný seznam. Číslování může být číselné nebo abecední. Kontejner s názvem pro skupinu prvků. Určuje možnost/možnost k výběru z rozevíracího seznamu , nebo . Pole pro zobrazení výsledku výpočtu vypočteného pomocí skriptu.

  Odstavce v textu. Definuje parametry pro pluginy vložené pomocí prvku. Prvek kontejneru obsahující jeden prvek a nula nebo více prvků. Sám o sobě nic nezobrazuje. Umožňuje prohlížeči vybrat nejvhodnější obrázek. Výstup textu bez formátování, zachování mezer a zalomení textu. Lze použít k zobrazení počítačového kódu, e-mailových zpráv atd. Indikátor dokončení úkolu jakéhokoli druhu. Definuje krátkou citaci. Kontejner pro východoasijské symboly a jejich dekódování. Definuje svůj vnořený text jako základní komponentu anotace. Přidá krátký popis nad nebo pod znaky obsažené v prvku, zobrazený menším písmem. Označí vložený text jako další anotaci. Pokud prohlížeč prvek nepodporuje, zobrazí alternativní text. Zobrazuje přeškrtnutý text, který není aktuální. Používá se k zobrazení textu představujícího výsledek provádění programového kódu nebo skriptu a také systémových zpráv. Zobrazeno jednoprostorovým písmem. Používá se k definování skriptu na straně klienta (obvykle JavaScript). Obsahuje buď text skriptu, nebo odkazuje na externí soubor skriptu pomocí atributu src. Definuje logickou oblast (sekci) stránky, obvykle se záhlavím. Ovládací prvek, který umožňuje vybrat hodnoty z navržené sady. Hodnoty variant jsou umístěny v . Zobrazí text menší velikostí písma. Určuje umístění a typ alternativních zdrojů médií pro , , . Kontejner pro inline prvky. Lze použít k formátování pasáží textu, jako je zvýraznění jednotlivých slov. Zdůrazní text a zvýrazní ho tučně. Zahrnuje vložitelné šablony stylů. Určuje spodní index psaní symbolů, například index prvků v chemických vzorcích. Vytvoří viditelný název pro značku. Zobrazí se s vyplněným trojúhelníkem, kliknutím na něj můžete zobrazit podrobnosti o titulu. Určuje pravopis znaků v horním indexu.

  Cheat list se značkami

  Pro snadné použití jsem seskupil značky do tematických sekcí a přidal hodnoty vlastností zobrazení pro každou značku. Chcete-li přejít na tabulku, klikněte na obrázek.

  Obsah:

  Dobrý den, milí čtenáři blogu. V minulém článku jsem se podíval na značky bloků pro strukturování textu. A dnes se podíváme na design textu html stránky, tzn. Podívejme se na značky, které pomohou zvýraznit důležité fragmenty textu, aby na ně upoutaly pozornost návštěvníků. Naučíme se také vkládat do stránky speciální znaky.

  Výběr fragmentů textu. Značky silné a em.

  Nejdůležitější HTML nástroj používaný ke zvýraznění důležitých částí textu je tag. Díky tomu bude text tučný. Tag může také zvýraznit text tučným písmem. Ačkoli jsou značky svým účinkem podobné, nejsou ekvivalentní. Značka je fyzická značka a jednoduše způsobí, že text bude vypadat tučně. A je logická značka a označuje důležitost vybraného textu. Tag je důležitější při optimalizaci webu pro vyhledávače a jeho obsah má pro vyhledávače větší váhu.

  Tagy se používají ke zvýraznění fragmentů textu kurzívou. A . Obsah těchto značek je zobrazen pod úhlem simulujícím ručně psané písmo.
  Při vývoji webových stránek se ke zvýraznění textu častěji používají značky a než značky a . Příklad použití značek , a pro formátování textu:

  HTML (z anglického HyperText Markup Language – „hypertextový značkovací jazyk“; vyslovováno h-ti-em-el) – standardní značkovací jazyk dokumentu na World Wide Web.

  A vypadá to takto:

  Aplikujme na naši stránku značky z předchozích článků:

  Web o autech.
  

  Vítejte na našem automobilovém webu. Zde najdete mnoho zajímavých a užitečných článků o autech, jejich technických vlastnostech a vlastnostech.

  
  

  Ve vědeckém jazyce je auto:

  
  

  Mechanické motorové bezkolejové silniční vozidlo s nejméně 4 koly.

  
  
  Klasifikace automobilů
  

  Auta jsou následujících typů:

  
  
  
  
  • Osobní automobil;
  
  
  • Náklad;
  
  
  • SUV;
  
  
  • Buggy;
  
  
  • Vyzvednout;
  
  
  • Sportovní;
  
  
  • Závodění.
  
  

  Výsledek:

  

  Kromě prvků , , a HTML má mnoho značek pro formátování textu dokumentu HTML. Zde je krátký seznam takových značek:

  • — Zkratka. ve výchozím nastavení se v prohlížeči zobrazí podtržené;
  • — Zkratka. Naproti tomu zkratka označuje zavedenou zkratku. Objeví se podtržené;
  • — malý citát, zobrazený kurzívou;
  • — fragment zdrojového kódu programu zobrazený jednoprostorovým písmem;
  • — označí text, který byl odstraněn z webové stránky, a zobrazí se přeškrtnutý;
  • — označuje nový termín v dokumentu zobrazený kurzívou;
  • — používá se ke zvýraznění textu, který byl přidán do nové verze dokumentu a zobrazí se podtržený;
  • — používá se ke zvýraznění dat zadaných z klávesnice nebo názvů kláves zobrazených jednoprostorovým písmem;
  • — používá se ke zvýraznění uvozovek, obsah je automaticky umístěn do uvozovek;
  • — označuje výstup dat programem zobrazený jednoprostorovým písmem;
  • - ve skutečnosti stejně jako , pouze je to fyzická značka a logická značka. zobrazeno jednoprostorovým písmem;
  • — zvýraznění názvu proměnné ve zdrojovém kódu programu zobrazené kurzívou.

  A takto se zobrazují v prohlížeči:

  

  Konce řádků

  Jak jsme se dozvěděli z předchozích článků, blokové prvky se používají k překladu řetězců, zejména tagu

  Zvýrazňující odstavec.

  Uveďme informace o autorských právech na naši webovou stránku:

  Všechna práva vyhrazena. rok 2013.

  
  

  Web o autech.

  Výsledek:

  

  A jak vidíme, čáry jsou odděleny příliš velkou vzdáleností, jako by spolu neměly nic společného. V tomto případě je lepší použít značku k přerušení řádků
  . Tato značka nastavuje zalomení řádku, ale na rozdíl od

  Nenastavuje odsazení řádku. Aplikujme značku
  na naší stránce:

  Všechna práva vyhrazena. rok 2013.
  Web o autech.

  Tohle je mnohem lepší:
  
  

  Proto v některých případech při formátování textu html stránky na tag nezapomínejte
  .

  Vkládání speciálních znaků. Doslovy.

  Někdy je potřeba do webové stránky vložit speciální znak, například následující znaky: , ©. Literály se používají k vkládání speciálních znaků do HTML. je posloupnost znaků, která začíná & a končí ; , a mezi nimi je umístěna posloupnost písmen - kód symbolu. Pro vložení symbolů © se tedy používají následující literály: Všechny programy->Příslušenství->Nástroje->Tabulka symbolů“ nebo stiskněte WIN+R a do okna napište „provést charmap“. Zobrazí se okno Tabulka symbolů.

  

  Pokud v seznamu symbolů vyberete znak, který nelze zadat z klávesnice, objeví se na stavovém řádku na levé straně nápis jako „Key: Alt+“. Vezměte tento znakový kód a vložte jej do literálu. Například vložme na naši stránku symbol © pomocí kódu symbolu. Tento symbol vybereme v „Tabulce symbolů“ a ve stavovém řádku na levé straně vidíme nápis „Klíč: Alt+0169“. Vezmeme kód „0169“ a místo doslovného na naší webové stránce vložíme ©:

  Všechna práva vyhrazena. © 2013.
  Web o autech.

  A dbáme na to, aby se na stránce vše zobrazovalo správně.

  To je vše, co pro dnešek mám. Jako vždy shrnu:

  Chcete-li zalomit řádky bez odsazení, použijte značku
  ;

  a pro vkládání speciálních znaků používáme literály jako: &; nebo & .

  V příštím článku vám řeknu, jak vkládat obrázky na stránku, takže doporučuji

  Pro označení textu v html se používá sada tagů, která umožňuje rozdělit text na logické části, zaměřit pozornost čtenáře na jeho jednotlivé části a také optimalizovat obsah pro snazší pochopení vyhledávacími roboty, což vede ke zlepšení hodnocení textové stránky ve výsledcích vyhledávání pro klíčové dotazy.

  Okamžitě bych rád poznamenal, že všechny prvky formátování textu popsané v tomto článku (kromě br) jsou spárovány. To znamená, že pro orámování obsahu tagem musí být přítomen jak úvodní tag, tak i závěrečný Your_tag>. Příklad:

  < h3>Správně napsaný název textu< p>Odstavec se zalomením řádku uprostřed odstavce.< br>Příklad použití nespárované značky uvnitř spárované značky.

  Tvorba textové struktury (blokové prvky). Značky nadpisů a odstavců.

  Značky h1-h6 jsou zodpovědné za zvýraznění textu ve formě nadpisů. O jejich sémantickém vlivu a významu pro budování logické struktury stránky pro vyhledávače byly napsány podrobnější informace.

  Stručně řečeno, názvy stránek hrají klíčovou roli v optimalizaci na stránce pro vyhledávače. V tomto ohledu by se znění nadpisů na stránce mělo co nejvíce přiblížit klíčovým dotazům, na které se chystáte článek propagovat ve výsledcích vyhledávání.

  Vizuálně vynikají nadpisy tučným písmem a velkým písmem vzhledem ke zbytku textu.

  Značka p je zodpovědná za zvýraznění odstavců. Spolu s tagy title tagp je prvek dekorace bloku textu, proto při jeho použití začíná každý následující odstavec na novém řádku, což se při použití vkládaných prvků nestává.

  HTML značky pro textové značení (vložené prvky)
  • span - podobný význam jako značka p, ale je to vložený prvek. Obvykle se používá k označení části textu v odstavci. Proč je to nutné? Vše je velmi jednoduché – určenému textu lze později pomocí CSS přiřadit design, který se liší od designu zbytku textu.
  • br - udělá zalomení řádku. ŠTÍTEK NENÍ PÁROVANÝ (tedy nemá uzavírací štítek). Přibližně stejně, jako kdybyste ve Verde zmáčkli Enter. Na rozdíl od obtékání vytvořeného blokovými prvky nenese žádnou logickou zátěž. Používá se výhradně pro krásnější textový design. Doporučuje se vyhnout se jeho používání, pokud to není nezbytně nutné, protože v podstatě jednoduše ucpe kód a pro dělení slov v textu jej stačí rozdělit na odstavce.
  • silné – písmo bude tučné. Slouží k umístění logických důrazů v textu pro vyhledávací roboty. Široce se používá pro interní optimalizaci textu. Doporučuje se, aby byly klíčové fráze v textu zarámovány do tohoto tagu, aby robot lépe pochopil, o čem článek je. POZORNOST! Je důležité to nepřehánět - pokud se podobné klávesy objeví v textu více než 3-5x, pak to může být považováno za přílišnou optimalizaci textu a stránka s textem bude ve výsledcích vyhledávání snížena.
  • b - vizuálně se neliší od silného, ​​ale nenese žádné sémantické zatížení pro vyhledávač. Používá se ke zvýraznění částí textu výhradně pro ty, kteří jej budou číst. Pokud například potřebujete zvýraznit frázi, která neobsahuje klíčová slova, ale může uživateli usnadnit pochopení struktury textu.
  • em - změní text uvnitř značky na kurzívu. Stejně jako strong slouží k interní optimalizaci textu pro propagaci vyhledávačů, jen má ve srovnání s ním menší váhu.
  • i - vizuálně se neliší od . Nenese žádnou sémantickou zátěž pro roboty, používá se pro usnadnění čtení textu pro uživatele. Podobné jako tag, pouze pro kurzívu.
  • ins – používá se k podtržení textu. Zvýrazňuje text pro uživatele i pro vyhledávač.
  • u - vizuálně shodné s předchozí značkou. Zvýrazňuje text pouze pro uživatele.
  • tt - zobrazí text v jednoprostorovém písmu. Nenese žádnou sémantickou zátěž. Monospace znamená, že všechny znaky v písmu používají při psaní stejnou mezeru.
  • předblokový prvek. Používá se k vytvoření velkých částí textu s neproporcionálním uspořádáním. Uvnitř můžete k formátování textu použít libovolné značky, kromě sub a sup.
  • sub - zobrazí text jako dolní index (zmenší písmo textu a zobrazí jej mírně pod úrovní řádku).
  • sup - zobrazí text jako horní index (zmenší písmo textu a zobrazí jej mírně nad úrovní řádku).
  • škrtnout (s) – přeškrtne text. Tyto dva tagy jsou si obsahově naprosto podobné. Moderní html dokumentace obecně odsuzuje jejich použití s ​​tím, že CSS lze použít k vyškrtnutí textu a tyto značky jednoduše zanesou kód.

  Použití více značek najednou

  Seznámili jsme se se základními značkami pro formátování textu. Lze je používat nejen samostatně, ale i jeden uvnitř druhého, hlavní věcí je zapamatovat si základní princip vnořování tagů - tag, který byl otevřen jako první, by měl být uzavřen jako poslední. Myslím:

  Tagy umístěné uvnitř jiných tagů tvoří pořadí vnoření. Takže v uvažovaném příkladu má tag i druhou úroveň vnoření vzhledem k tagu p.

  POZNÁMKA! Vložené prvky uvnitř prvků bloku jsou povoleny, ale prvky bloku uvnitř vložených prvků nejsou. I když prohlížeč zobrazí vše správně, pokud například použijete značku p uvnitř značky b. Z pohledu html dokumentace to nebude pravda. To znamená, že takový kód bude obsahovat chybu a můžete to snadno zkontrolovat pomocí jakékoli služby ověření kódu HTML.

  Otázky pro sebeovládání:
  • Které značky formátování textu jsou blokové a které jsou vložené? Jaký je mezi nimi rozdíl?
  • Jaké jsou způsoby, jak udělat text tučným? Jaký je mezi nimi rozdíl?
  • Jaké jsou různé způsoby psaní textu kurzívou? Jaký je mezi nimi rozdíl?
  • Jak správně zalomit řádky v html?
  • Jak se určuje pořadí vnoření značek?

  Chcete-li mu dát konkrétní styl, musíte text umístit do příslušného kontejneru.

  Všechny formátovací značky lze rozdělit do tří skupin:

  1. Značky nadpisu (h1-h6).

  2. Značky návrhu hlavního textu ( , , , atd.).

  3. Seskupování značek (

  , ,
  )

  Značky titulků

  Proměňují běžný text na nadpis určité úrovně. Značka vytváří nadpis první úrovně – největší a nejdůležitější (obvykle nadpis článku na stránce) a je zodpovědný za nadpis šesté úrovně – nejmenší a nejnenápadnější. Tyto značky jsou důležité jak pro uživatele, tak pro vyhledávače – oba milují nadpisy s podnadpisy. Musí se dodržovat hierarchie úrovní, to znamená jít pozadu a ne naopak.

  Chcete-li pochopit, jak to funguje, zadejte do souboru html následující kód:

  Nadpis první úrovně Nadpis druhé úrovně Nadpis třetí úrovně Nadpis čtvrté úrovně Nadpis páté úrovně Nadpis šesté úrovně

  V prohlížeči to bude vypadat takto:

  Značky návrhu textu těla

  Umožňuje formátování na úrovni znaků. Pojďme se podívat, co s nimi můžete dělat.

  Tučné písmo

  Je potřeba zaměřit pozornost na text. Je to důležité i pro vyhledávače, dokážou zvýraznit klíčová slova.

  Značky a jsou zodpovědné za tučný styl.

  Horní a dolní index

  Lze je použít ve vzorcích, rovnicích a označení určitých veličin.

  Tag je zodpovědný za vytváření spodních indexů a tag se používá pro horní indexy.

  X1=32 m2

  Zmenšování

  Pokud potřebujete, aby byl text o jeden menší, než je nastavená hodnota na celé stránce, musíte použít značku

  Prostý text. Zmenšený text.

  Podtržítko

  Tento typ zvýraznění lze použít k označení změn provedených v dokumentu nebo jednoduše k upozornění na text.

  Prostý text. Podtržený text.

  Přeškrtnutí

  Informace můžete přeškrtnout, pokud již ztratily svou relevanci. Tag je k tomu určen.

  Kurzíva

  Je potřeba zaměřit pozornost na text a lze jej vytvořit pomocí značky nebo .

  Počítačový textový vstup

  Stává se, že potřebujete přidat zdrojový kód programu a výsledky jeho práce na webovou stránku. Aby bylo snadné vizuálně odlišit různé části textu od sebe, zavedli vývojáři HTML značky této skupiny.

  Kontejner obsahuje kód programu, přičemž jeho proměnné jsou zvýrazněny tagem a výsledkem spuštění je . Kontejner obsahuje text, který musí uživatel při práci s programem zadávat z klávesnice, a vše uzavřené ve značkách si zachovává původní formát včetně nadbytečných mezer a zalomení řádků.

  takže a, b, c, toto je výsledek spuštění programu a toto je text zadaný uživatelem a zobrazí se asi takto.

  Citáty a definice

  Kód programu bude vypadat takto, proměnné jsou označeny následovně: a, b, c, toto je výsledek provádění programu a toto je text zadaný uživatelem. Zachování původního formátování vypadá asi takto.

  Citace v tagu blockquote. Citace uvnitř kontejneru citace. Krátká citace s tagem q. Zvýrazněná definice. Zkratka (NGO, individuální podnikatel).

  Obecný příklad

  Chcete-li lépe porozumět tomu, za co je každý tag zodpovědný a jak funguje, podívejte se na následující kód a výsledek jeho spuštění.

  Tučný text lze vytvořit pomocí značek strong a b. Em a jsou zodpovědní za kurzívu. i.

  Tagy sub a sup se používají k vytváření dolních indexů (x1...xn) a horních indexů (42=16). Del škrtne, ins podtrhne.

  Značky code, kbd, var a samp se používají zřídka a jsou potřeba k zobrazení výpisů programů

  abbr je potřeba pro označení zkratek (HTML). Tagy blockquote, cit a q se používají k návrhu citátů (Nebe už dýchalo podzimem)

  Značka pre zachovává původní formátování textu bez odstranění mezer nebo zalomení řádků.

  Prohlížeč interpretuje tento kód následovně:

  

  Seskupování značek

  Je nutné, aby text neplynul v jednom souvislém řádku, ale byl rozčleněn na logické složky.

  • Uvnitř značek je odstavec.

  První odstavec

  Druhý odstavec

  

  • Štítek
    přesune se na další řádek v odstavci (před řádkem nebude žádné odsazení).
  • umožňuje nakreslit vodorovnou čáru. Můžete jej použít k přehlednějšímu oddělení textu. Atributy width, size, color, align a nosshade určují šířku, tloušťku, barvu, zarovnání a žádný 3D efekt čáry.

  Řádek nad čárou. Řádek pod řádkem.

  SOUVISEJÍCÍ ČLÁNKY
  
  • Zpětná vazba
  • Mapa stránek
  • O webu
  
  
  

  Tag pro vytvoření tabulky.
  	Definuje tělo tabulky.
  		Vytvoří buňku tabulky.
  	Používá se k deklaraci fragmentů kódu HTML, které lze naklonovat a vložit do dokumentu pomocí skriptu. Obsah značky není jejím potomkem.
  	Vytváří velká pole pro zadávání textu.
  	Definuje zápatí tabulky.
  	Vytvoří název buňky tabulky.
  	Definuje název tabulky.
  	Definuje datum/čas.
  	Název dokumentu HTML, který se zobrazuje v horní části záhlaví prohlížeče. Může se také objevit ve výsledcích vyhledávání, takže to je třeba vzít v úvahu při zadávání názvu.
  Vytvoří řádek tabulky.
  	Přidá titulky pro prvky a .
  	Zvýrazní pasáž textu podtržením bez dalšího zdůraznění.
  	Vytvoří seznam s odrážkami.
  	Zvýrazňuje proměnné z programů jejich zobrazením kurzívou.
  	Přidá video soubory na stránku. Podporuje 3 video formáty: MP4, WebM, Ogg.
  	Označuje prohlížeč, kde by se mohl přerušit dlouhý řádek.