Chcete-li přejít na nový řádek, použijte značku (tag)
. Řekne prohlížeči, aby přestal umisťovat text a další prvky stránky na aktuální řádek a přesunul se na nový řádek. Tento tag (tag) nemá svůj lomítkový protějšek, tzv. uzavírací tag (tag).

Hlavním použitím těchto značek je vynutit umístění vložených prvků na konkrétní místo na stránce. Hodí se také v případech, kdy je potřeba zvětšit prázdné plochy mezi jednotlivými prvky stránky.

S nadpisem stránky H1 a odstavcem P jsme se částečně seznámili v první lekci o struktuře HTML dokumentu. Nyní se podíváme na logické značky značek: nadpisy, odstavce, seznamy, viditelné prvky prvku Body a značky fyzického formátování podrobněji. Chcete-li to provést, mírně změňte naši ukázkovou stránku nebo ji zadejte znovu:

Na naši školicí html stránku jsme přidali (označeno šipkami, jednou): nadpis 2. úrovně - značka H2, dva nadpisy 3. úrovně - značka H3, další odstavec - značka P, seznam s odrážkami - Ul a několik značek fyzického formátování . Otevřeme stránku v prohlížeči:

Tagy H1-H3 označují nadpisy různých úrovní - je jich celkem šest. Nadpis nejnižší úrovně je H6. Nadpisy musí být používány logicky a nadpis H1 nejvyšší úrovně by se měl na stránce objevit pouze jednou. Nadpis H1 je v prohlížečích zobrazen velkým písmem a velikost písma v nadpisech dalších úrovní je odpovídajícím způsobem zmenšena.

Vyhledávací roboti kladou velký důraz na obsah nadpisů nejvyšší úrovně. A pro uživatele je snazší navigovat na stránce s logicky správně sestavenými nadpisy.

Značky fyzického formátování

Na stránce je za druhým odstavcem vidět vodorovná lišta - je vytvořena prvkem Hr, který nemá uzavírací značku. Značka Br znamená nový řádek, také není spárována - bez uzavírací značky. Při formátování textu můžete použít několik prvků Br za sebou - každý další přidá nový prázdný řádek.

Nyní věnujme pozornost slovu „body“ ve druhém odstavci, uzavřenému ve spárované značce B, díky níž je slovo tučné. A fráze „formátovat text“ je zobrazena kurzívou - to je dosaženo pomocí značky I. Značka U nastavuje podtržení (v našem příkladu není).

Kromě těchto značek, které zvýrazňují fragmenty textu, existuje v HTML také značka Strong – zvýrazní fragment, který je významově důležitý (tučné). A značka Em je o něco méně důležitá (kurzíva). Vyhledávací roboti věnují větší pozornost těmto dvěma značkám, které označují fráze, které jsou důležité ve svém logickém významu. Je vhodné do nich zahrnout klíčová slova, ale neměli byste to přehánět. Totéž platí pro nadpisy.

Zde jsou některé další značky pro formátování fyzického textu: Q – Zvýrazňuje citaci v řádku. Blockquote block element – ​​tento tag může obsahovat více odstavců.

Značka Code se používá k označení fragmentů kódu, musí se používat se zalomením řádků Br a nezalomitelnými mezerami: k jejich označení se používají speciální symboly. symbol (první znak - ampersand: klávesa 7 se stisknutou klávesou Shift v anglickém rozložení). Ale tag Pre zobrazuje kód programu tak, jak je, s mezerami a tolika řádky, kolik je v kódu.

Toto jsou nejčastěji používané prvky textového designu pro další formátovací značky a speciální znaky, viz HTML Reference, která se nachází na stejném webu – má pohodlnou abecední navigaci.

Vytváření html seznamů

Zbývá zvážit tvorbu seznamů, máme ji označenou a specifikovanou párovým tagem Ul a jeho prvky, respektive položky, tagem Li (1. screenshot). Pomocí atributu type můžeme u značek Ul i Li změnit typ značky. Standardně, tzn. pokud atribut není uveden, jeho hodnota je "disk" - kruh. Atribut type můžete nastavit na hodnotu „circle“ - circle. Nebo takhle:

- dostaneme seznam se čtvercovými značkami.

Ve skutečnosti se nezaměřím na jiné atributy značek než povinné a několik příkladů pro obecné porozumění. Pro nastavení stylů je lepší použít vlastnosti CSS - k nim se dostaneme a atributy najdete v referenční knize.

Kromě odrážkových seznamů existují číslované seznamy, které jsou specifikovány tagem Ol, a prvky seznamu, jako ty s odrážkami, tagem Li. Navíc pro oba typy seznamů můžete vytvořit vnořené seznamy. Pojďme si úkol zkomplikovat a změnit náš seznam na ukázkové stránce na následující:



Otevřeme stránku v prohlížeči a jasně vidíme: číslovaný seznam s vnořeným seznamem s odrážkami, pro který hodnota „čtverec“ atributu type určuje čtvercové značky.

Tagy definující odstavec, mezeru, HTML blok a odstavec

Podívejme se na to podrobně HTML bloky a odstavce jako prvky webové stránky.

• HTML odstavec definované značkami.
• HTML odstavce obvykle obsahují text, formátovací značky a obrázky.
• HTML odstavec nemůže obsahovat prvky bloku, jako jsou záhlaví
  

  -

  , blokovat
  a další odstavce.
• HTML blok definované značkami
  .
• HTML blok může obsahovat libovolné prvky webové stránky v libovolném množství.
• HTML bloky Skvělé pro webové stránky a snadno se s ním manipuluje.

Zvažte níže uvedený kód:

Výsledek:

Můžeme to vidět HTML odstavce mají svislé odsazení – to je vlastnost značek. HTML bloky

takové prostory nevznikají, protože nenesou žádný náklad, ale jsou to prostě kontejnery.

Tagy nemohou obsahovat jiné resp

. Uvnitř mohou být umístěny lineární prvky, jako jsou nebo například značky odpovědné za formátování textu.

Tagy a , jsou v zásadě to samé, ale konsorcium W3C doporučuje používat malá písmena. V nové verzi HTML, stejně jako v moderním XHTML, je používání velkých písmen při psaní značek zakázáno.

Blok

může jich obsahovat tolik, kolik chcete
a další prvky HTML dokument. Je ideální pro layout, ale o tom později – v lekcích CSS tutorial.

HTML prostor z tabulky speciálních znaků

HTML prostor umožňuje zvětšit vzdálenost mezi slovy a znaky.

Co se týče mezer mezi slovy, bez ohledu na to, kolik jich je v Poznámkovém bloku, tedy ve zdrojovém kódu, na webové stránce se zobrazí pouze jedna. Pokud potřebujete zvětšit vzdálenost, použijte znak mezery z tabulky symbolů. Můžete se zeptat: Proč jsou tyto zakódované významy běžných znaků potřeba? - Odpovím: Jsou potřeba k zobrazení např. takových závorek< >. Jinými slovy, pro zobrazení značek na obrazovce napíšu v editoru: . Tagy , jak si pamatujeme, převést text na monospace (psaný na stroji).

Způsoby zobrazení odstavce HTML

Příklady výstupu odstavce.

Kategorie: . Zatím žádné komentáře. Zveřejněno: 17.05.2012.

Dobrý den, dnes se podíváme na velmi potřebné téma jako je strukturování textu v HTML a po přečtení tohoto článku budeme umět správně a krásně strukturovat text, který je na stránce našeho webu. V článku vám řeknu a samozřejmě na příkladech ukážu, jak vytvářet odstavce pro stránky, vytvářet nadpisy různých úrovní a také přidávat několik typů seznamů. Nyní pojďme k samotnému procesu strukturování textu.

Bez značek odstavců bude náš text na stránce vypadat jako jeden velký kus textu, který není pro návštěvníka vhodné číst, proto byla vytvořena značka, která vytváří odstavec v html a díky tomu můžete rozdělit velký text na logické části. Tato značka vypadá takto: mezi těmito dvěma značkami by měl být text, který pak bude oddělen od hlavního textu.

Podívejme se na značku odstavce s příkladem. K tomu jsem již připravil velký kus textu, který budeme strukturovat. Otevřete dokument v editačním programu, můžete použít poznámkový blok nebo poznámkový blok++. Otevřeme dokument a vidíme, že máme jen velký kus textu bez jakéhokoli rozdělení.



Nyní vložme naši značku do dokumentu každých čtyři až pět řádků textu.



A nyní soubor uložíme a otevřeme v libovolném prohlížeči.



Nyní vidíme, že náš text je rozdělen do mnoha logických částí a text se nyní čte mnohem pohodlněji. Doufám, že chápete, jak můžete text rozdělit na logické části (odstavce) a pro vaše návštěvníky bude mnohem pohodlnější číst články.

Každý text se neobejde bez nadpisů a podnadpisů, které se liší významem a důležitostí. Tag h1-h6 je zodpovědný za nadpisy v html a v závislosti na čísle je určena velikost nadpisu, všechny nadpisy jsou zvýrazněny tučně; Podívejme se na použití hlaviček na příkladu.



Všechna tato záhlaví na webu budou vypadat takto:



Chcete-li optimalizovat stránky na webu, musíte velmi opatrně používat nadpisy, zejména značky h1 a h2. Na stránce by měl být pouze jeden nadpis h1, toto by měl být hlavní nadpis webu a všechny ostatní jsou podnadpisy. Použijte h2 jednou nebo dvakrát, ne častěji a všechny ostatní nadpisy můžete použít v průměru pětkrát až šestkrát a to může mít pozitivní vliv na optimalizaci.

Seznamy v HTML.

V HTML můžeme také vytvářet seznamy na stránce, seznamy jsou velmi užitečné pro poskytování informací na webu. Seznamy jsou také velmi užitečné při vytváření šablon webových stránek a k tomu všemu se dostaneme o něco později. Nyní přejdeme ke zvážení všech možností seznamu, jako je číslovaný seznam, seznam s odrážkami.

Číslovaný seznam v HTML.

Diskusi na téma seznamů v HTML zahájíme číslovaným seznamem v HTML a nyní můžeme bezpečně začít studovat. Úplně první věc, kterou uděláme, je připravit seznam, abychom demonstrovali schopnosti číslovaného seznamu v HTML. Vezměme si příklad ze života a sepišme si seznam pro návštěvu supermarketu.

Kečup
Majonéza
Sůl
Pepř
Kopr
Lilek
Rajčata

Nyní je seznam sestaven a začínáme jej formátovat. Číslovaný seznam v HTML je specifikován pomocí párového tagu a nyní se na příkladu podíváme na proces vytváření číslovaného seznamu.

Nejprve musíme všechny položky seznamu uzavřít do tagu.

Úkol

Přidejte odsazení do prvního řádku každého odstavce.

Řešení

Když potřebujete nastavit odsazení odstavce, nazývané také odsazení, je nejlepší použít vlastnost stylu text-indent. Jeho hodnota určuje, o kolik se má text prvního řádku posunout doprava z jeho původní pozice. Šířka textového bloku se nemění a zůstává nastavena původně. Velikost odsazení lze zadat v pixelech, procentech nebo jiných dostupných jednotkách (příklad 1).

Příklad 1: Odsazení prvního řádku

HTML5 CSS 2.1 IE Cr Op Sa Fx

Babylonské pandemonium je podle biblické legendy neúspěšným pokusem krále Nimroda postavit v Babylonu nebetyčný sloup. Bůh, rozhněvaný na lidi pro jejich bezohlednou touhu, se rozhodl stavitele potrestat: zmátl jejich jazyk, takže si přestali rozumět, byli nuceni zastavit stavbu a postupně se rozprchli po celém světě. Odtud, jak starověcí vysvětlovali, přišel rozdíl v jazycích.

V obvyklém pojetí babylonské pandemonium znamená nepořádek, zmatek s velkým davem lidí.





Výsledek tohoto příkladu je znázorněn na Obr. 1.