Ako viete, hlavným obsahom webových stránok je text. So vzácnou výnimkou špeciálnych galérií. Preto nie je prekvapujúce, že HTML má toľko rôznych ovládacích prvkov zobrazenia textu.

V skutočnosti, ak chcete zobraziť textový reťazec v okne prehliadača, nemusíte používať žiadne značky: Stačí napísať samotný text. Ale keď to potrebujete rozdeliť aspoň na odseky, tu musíte použiť značky. Faktom je, že rôzne počítačové systémy používajú rôzne znaky na rozdelenie textu do odsekov a dokumenty HTML by sa mali vždy zobrazovať čo najjednotnejšie na rôznych počítačových platformách. Preto sme museli zaviesť značky na označenie odsekov.

Na začiatku každého odseku je značka a na konci záverečná značka . Tag zároveň prirodzene má nejaké parametre. Patria sem nám už známe všeobecné identifikačné parametre trieda A id, parameter stylingu štýl, na ktorý sa pozrieme v druhej kapitole, a parameter zarovnania zarovnať. O poslednom parametri by sme sa mali porozprávať trochu podrobnejšie.

V HTML sa výraz „zarovnanie“ vzťahuje na horizontálne aj vertikálne umiestnenie prvku. Ale v prípade odsekov textu má zmysel hovoriť iba o horizontálnom zarovnaní alebo, ako sa to tiež nazýva, „zarovnaní“.

Zarovnanie vám umožňuje stlačiť odsek na ľavý alebo pravý okraj výrezu prehliadača, vycentrovať ho alebo roztiahnuť slová tak, aby text rovnomerne vyplnil celú šírku priestoru, ktorý je mu pridelený. Na tieto účely sa používajú hodnoty vľavo, vpravo, v strede A ospravedlniť, resp. Uvažujme o ich použití na príklade iného HTML dokumentu.

Výpis 1.4

Horizontálne zarovnanie a63acev

Odsek pritlačený k ľavému okraju
Odsek pritlačený k ľavému okraju
Stredný odsek

Odsek roztiahnutý na šírku

Výsledok prezerania súboru s takýmto kódom pomocou prehliadača Internet Explorer je na obr. 1.4. Ako vidíte, posledný odsek, ktorý mal byť podľa nášho kódu roztiahnutý na šírku, zobrazuje Internet Explorer rovnako ako prvý. Tento prípad môže slúžiť ako jasný príklad toho, ako prehliadače vnímajú HTML kód odlišne. V našom prípade Internet Explorer jednoducho ignoroval neznámy parameter pomocou možnosti štandardného zobrazenia.

Ryža. 1.4. Okno prehliadača zobrazujúce výsledok súboru zobrazeného vo výpise 1.4

Niekedy sa tvorcovia webových stránok snažia na ďalšie oddelenie jedného odseku od druhého použiť prázdne odseky, to znamená, že medzi značkami začiatku a konca odseku nie je nič. Podľa špecifikácií by prehliadače mali takéto konštrukcie jednoducho ignorovať. Preto na oddelenie odsekov alebo vynútenie zalomenia riadku v rámci jedného odseku by ste mali použiť značku
. Toto je direktívna značka. Jednoducho označí miesto, kde treba displej presunúť na iný riadok. Príklad toho, ako možno túto značku použiť na dosiahnutie oboch týchto cieľov, je uvedený v dokumente HTML, ktorého kód je uvedený vo výpise 1.5.

Výpis 1.5

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

Nútené prerušenia riadkov


Paragraf, ktorý sme
Nútene roztrhané
Ďalší odsek

Odsek po nútenej prestávke

A ako tento súbor vyzerá pri prezeraní pomocou prehliadača je znázornené na obr. 1.5.

Ryža. 1.5. Okno prehliadača zobrazujúce výsledok súboru zobrazeného vo výpise 1.5

Tag
okrem všeobecných identifikačných parametrov má aj parameter jasný, ktorý sa používa na presnejšie zarovnanie textu, keď sa obtáča okolo objektu, ako je napríklad grafika vložená do webovej stránky. Hodnota tohto parametra môže byť jedno zo štyroch preddefinovaných kľúčových slov: žiadne, vľavo, vpravo, všetky.

Hodnota none je predvolená a označuje, že ďalší riadok bude začínať tam, kde by normálne začínal bez tohto parametra. Význam vľavo označuje, že ďalší riadok bude začínať na ľavom okraji objektu zalamovaného textom. Ak na tieto účely potrebujete použiť pravý okraj, mali by ste použiť hodnotu správny. A zmysel všetky informuje prehliadač, že môže použiť ľavý aj pravý okraj objektu, pokiaľ je text zobrazený čo najkompaktnejšie.

Teraz prejdime k zváženiu dizajnu písma textu. V ktoromkoľvek bode odseku môžeme použiť značku s určitou sadou parametrov, ktorá bude určovať vzhľad písma, ktorým sa bude zobrazovať text nachádzajúci sa za touto značkou. Ukončenie tohto tagu sa vykonáva pomocou jeho uzatváracieho páru .

Tag má nasledujúce parametre: veľkosť, používa sa na označenie veľkosti písma, ktoré sa má použiť, farba- na nastavenie farby znakov písma a tvár, ktorá označuje, ktoré písmo sa použije na zobrazenie textu. Pozrime sa na tieto parametre.

Ako sme práve povedali, parameter size slúži na určenie veľkosti znakov v použitom písme. Hodnoty tohto parametra sú čísla od jednej do siedmich. Označujú určitú relatívnu veľkosť znakov. Faktom je, že v HTML nemôžete nastaviť absolútnu veľkosť znakov v bodoch, ako sme to zvyknutí robiť v bežných kancelárskych aplikáciách. Používateľ si bude prezerať webovú stránku na svojom počítači a my vopred nevieme, aké fonty môže mať nainštalované a aké veľkosti sú dostupné. Preto môžeme určiť iba relatívnu veľkosť písma a samotný prehliadač používateľa vyberie najvhodnejšiu veľkosť.

Ako hodnotu parametra size môžeme určiť aj zmenu veľkosti písma. Ak chcete napríklad zväčšiť veľkosť písma o jednu úroveň, použite nasledujúcu konštrukciu:

Ak chcete zmenšiť veľkosť znakov o dve úrovne, použite nasledujúci kód:

Na použitie takýchto štruktúr je však potrebné začať od určitej základnej veľkosti. Ak chcete nastaviť túto veľkosť, použite značku s rovnakým parametrom veľkosť. Ak sa tento tag nepoužije, potom sa ako základná veľkosť znaku použije tretia úroveň. Uveďme si príklad použitia týchto značiek.

Výpis 1.6.

Veľkosť symbolu

Štýly postáv

Text je tučný resp kurzíva

A možno v rovnakom čase tučné a kurzíva
Stáva sa zdôraznené a neprečiarknuté.
alebo monospace.
Veľkosť znakov môžeme zväčšiť a zmenšiť.

Ako vidíte na príklade, môžeme navzájom kombinovať rôzne štýly. Mali by ste však byť opatrní v poradí, v akom štítky umiestňujete. Otváracie aj zatváracie značky musia byť vnorené do iných značiek, ktoré boli predtým použité. Príklad toho možno vidieť v desiatom riadku zoznamu. A ako tento HTML dokument vyzerá pri prezeraní pomocou prehliadača je na obr. 1.7.

Pozreli sme sa na spôsoby, akými sa nastavujú rôzne parametre zobrazovania textu. HTML však poskytuje niekoľko základných spôsobov zobrazenia textu, ktoré nie je potrebné špecifikovať množstvom značiek. Majú svoje vlastné značky, to znamená, že sú definované určité kategórie textu, ktoré sa zobrazujú preddefinovaným spôsobom. Všetky tieto kategórie sa najčastejšie používajú vo vedeckom a počítačovom priemysle. Poďme si ich vymenovať.

• Výraz je v texte zvýraznený pomocou dvojice značiek a .
• "Vylepšené" zvýraznenie, určené na ďalšie upútanie pozornosti, je vytvorené pomocou visačky a jej uzatváracieho dvojčaťa.
• Pomocou značiek a je uvedené, že text umiestnený medzi nimi je citát.
• Definícia určitého pojmu je zvýraznená pomocou značiek a .
• Dvojica značiek sa používa na zvýraznenie zdrojového kódu v akomkoľvek programovacom jazyku.
• Výstup textových informácií programom je formátovaný pomocou značiek AND.
• Text zadaný používateľom je označený značkami a . P Premenné v zdrojovom kóde programov sú označené pomocou dvojice značiek a .
• Značky a zvýraznené skratky.
• A zavedené kombinácie písmen, ktoré nie sú skratkami, teda akronymy, sú zvýraznené značkami a .

Nestačí však poznať názvy značiek, musíte tiež jasne pochopiť, ako presne formátujú text. A tu sa nezaobídete bez príkladu.

Ryža. 1.7. Okno prehliadača zobrazujúce výsledok súboru zobrazeného vo výpise 1.7

Výpis 1.8

Štandardné možnosti zobrazenia

Toto je normálny text
Toto je výber. A výraznejšie zvýraznenie

Výsledok zobrazenia takéhoto HTML dokumentu je na obr. 1.8.

Ryža. 1.8. Okno prehliadača zobrazujúce výsledok súboru zobrazeného vo výpise 1.8

Veľmi často je potrebné umiestniť text na webovú stránku, ktorá bola vopred pripravená pomocou nejakého textového editora, ktorý už text nezávisle naformátoval. V tomto prípade formát textu, jeho pomlčky a umiestnenie priamo závisia od dĺžky riadku v znakoch, ktorá bola nastavená v tomto textovom editore. Ak je text umiestnený na webovú stránku konvenčnými prostriedkami, toto formátovanie bude prirodzene narušené. Preto bola pre tieto vopred naformátované úryvky zavedená vlastná značka. Táto značka má parameter width, ktorého hodnota je dĺžka riadku v znakoch. Prirodzene, pred použitím tejto značky je vhodné vynútiť presné písmo, ktoré bolo použité pri formátovaní textu. Na vloženie vopred naformátovaného textu teda môžeme použiť nasledujúci útržok kódu:

text.

V tomto príklade špecifikujeme, že text sa má zobraziť na základe predpokladu, že riadok má šesťdesiat znakov. Vo vopred naformátovanom texte však tiež neplatia pravidlá pre „zbalenie medzier“. Faktom je, že keď prehliadač narazí na niekoľko po sebe idúcich medzier v obyčajnom texte webovej stránky, zbalí ich do jedného priestoru. Vopred naformátovaný text však neprechádza takou transformáciou, čo mu umožňuje zachovať jeho formátovanie, ktoré sa v najjednoduchších textových editoroch vykonáva pomocou bielych znakov. Mimochodom, v HTML sa znak tabulátora považuje aj za znak medzery.

Treba tiež poznamenať, že HTML poskytuje možnosť používať značky na zobrazenie horných úvodzoviek, ktoré sa zvyčajne používajú na zvýraznenie priamej reči a niektorých úvodzoviek. Citáty sú opatrené štítkom s koncovým dvojčaťom . A na rámovanie priamej reči sa zvyčajne používajú značky a. Zároveň tag má parameter cit, ktorého hodnotou je sieťová adresa, nazývaná aj URL, internetového zdroja, na ktorom sa pôvodne nachádzal citovaný text. A spolu s tagom sa zvyčajne používa parameter lang, ktorého hodnotou je kódové označenie jazyka, podľa interpunkčných pravidiel, v ktorých sú umiestnené obmedzujúce úvodzovky. Nie je žiadnym tajomstvom, že rôzne jazyky používajú rôzne úvodzovky.

Treba spomenúť aj problém prestupov. Tvorcovia webových stránok zvyčajne na tento problém ani nepomyslia a prehliadače sa nezaoberajú zalamovaním slov. Ak sa slovo nezmestí na riadok, jednoducho sa presunie na iný riadok. Toto však nie je jediný správny spôsob zobrazenia textu. Môže nastať situácia, keď potrebujete zobraziť text pomocou delenia slov. HTML poskytuje dva typy pomlčiek – explicitné a takzvané „mäkké“. Explicitné delenie slov sa vytvára pomocou znaku pomlčka, ktorý sa zvyčajne nahrádza numerickými náhradami textu „-“. Explicitné delenie slov je však nepohodlné, pretože pri zmene veľkosti okna prehliadača sa môže zmeniť aj dĺžka riadku, ale znak pomlčky zostane viditeľný. Aj keď je v strede radu. Preto často používajú „mäkké“ prevody. Vytvárajú sa pomocou náhrady textu "-". V tomto prípade nie sú v texte viditeľné symboly mäkkých pomlčiek a iba v prípade, že sa niektoré slovo, do ktorého boli tieto symboly vložené, úplne nezmestí do riadku, je pomlčky rozdelené na slabiky podľa vloženého „ mäkké“ pomlčky. A iba jeden zo symbolov mäkkého delenia v tomto slove sa stane viditeľným.

HTML tiež umožňuje zobraziť horné a dolné indexy pomocou svojich značiek. Dvojica značiek a sa používa na vytvorenie horného indexu a dolný index musí byť obklopený značkami a. Pozrime sa na príklad použitia týchto značiek.

Výpis 1.9

Bepx a dolné indexy

Voda je H20

Ako presne prehliadač zobrazuje indexy je znázornené na obr. 1.9.

Ryža. 1.9. Okno prehliadača zobrazujúce výsledok súboru zobrazeného vo výpise 1.9

Textový dizajn zahŕňa aj vodorovné čiary, ktoré často oddeľujú významné časti textového obsahu webových stránok. Do textu dokumentu HTML sa pomocou značky vloží riadok. Tag má niekoľko parametrov, ktoré umožňujú doladiť vzhľad vodorovnej čiary.

Parameter align umožňuje určiť vodorovné zarovnanie čiary. Parameter môže mať jednu z troch prednastavených hodnôt: vľavo, vpravo a v strede, ktoré posúvajú vodorovnú čiaru k ľavému alebo pravému okraju výrezu, prípadne ju vycentrujú. Predvolená hodnota je stred. Ak značka obsahuje parameter noshade, zobrazená vodorovná čiara nebude mať tieň. A posledný parameter šírky umožňuje nastaviť dĺžku vodorovnej čiary. Predvolená hodnota je "100%". A výška riadku v pixeloch sa nastavuje pomocou parametra size. Pozrime sa na použitie všetkých týchto parametrov na príklade.

Výpis 1.10

Toto je štandardne zobrazený normálny riadok

Ako vyzerá takýto HTML dokument pri prezeraní pomocou prehliadača je na obr. 1.10.

A tu možno môžeme dokončiť našu úvahu o možnostiach formátovania textu, ktoré sú vlastné HTML.

Ryža. 1.10. Okno prehliadača zobrazujúce výsledok súboru zobrazeného vo výpise 1.10

HTML tagy sú základom jazyka HTML. Značky sa používajú na vymedzenie začiatku a konca prvkov v značke.

Každý HTML dokument pozostáva zo stromu HTML prvkov a textu. Každý prvok HTML je identifikovaný počiatočnou (otváracou) a koncovou (zatváracou) značkou. Otvárací a uzatvárací štítok obsahuje názov štítku.

Všetky prvky HTML sú rozdelené do piatich typov:

• prázdne prvky - , ,
  , , , , , ,
  Používa sa na uloženie dodatočných informácií o stránke. Tieto informácie používajú prehliadače na spracovanie stránky a vyhľadávače na jej indexovanie. V bloku môže byť niekoľko značiek, pretože v závislosti od použitých atribútov nesú rôzne informácie. Indikátor merania v danom rozsahu. Časť dokumentu obsahujúca navigačné odkazy na lokalitu. Definuje sekciu, ktorá nepodporuje skriptovanie. Kontajner na vkladanie multimédií (napr. audio, video, Java applety, ActiveX, PDF a Flash). Do aktuálneho dokumentu HTML môžete vložiť aj inú webovú stránku. Značka sa používa na odovzdávanie parametrov doplnku. Objednaný očíslovaný zoznam. Číslovanie môže byť číselné alebo abecedné. Kontajner s názvom pre skupinu prvkov. Určuje možnosť/možnosť na výber z rozbaľovacieho zoznamu , alebo . Pole pre zobrazenie výsledku výpočtu vypočítaného pomocou skriptu.

  Odseky v texte. Definuje parametre pre pluginy vložené pomocou prvku. Prvok kontajnera obsahujúci jeden prvok a nula alebo viac prvkov. Sama o sebe nič nezobrazuje. Umožňuje prehliadaču vybrať najvhodnejší obrázok. Vydáva text bez formátovania, zachováva medzery a zalomenia textu. Môže sa použiť na zobrazenie počítačového kódu, e-mailových správ atď. Indikátor dokončenia úlohy akéhokoľvek druhu. Definuje krátku citáciu. Kontajner pre východoázijské symboly a ich dekódovanie. Definuje svoj vnorený text ako základný komponent anotácie. Pridá krátky popis nad alebo pod znaky obsiahnuté v prvku zobrazený menším písmom. Označí vložený text ako dodatočnú anotáciu. Zobrazuje alternatívny text, ak prehliadač daný prvok nepodporuje. Zobrazuje text, ktorý nie je aktuálny, s prečiarknutím. Používa sa na zobrazenie textu reprezentujúceho výsledok vykonávania programového kódu alebo skriptu, ako aj systémových správ. Zobrazuje sa jednopriestorovým písmom. Používa sa na definovanie skriptu na strane klienta (zvyčajne JavaScript). Obsahuje buď text skriptu, alebo odkazuje na externý súbor skriptu pomocou atribútu src. Definuje logickú oblasť (sekciu) stránky, zvyčajne s hlavičkou. Ovládací prvok, ktorý vám umožňuje vybrať hodnoty z navrhovanej sady. Hodnoty variantov sú umiestnené v . Zobrazí text menšou veľkosťou písma. Určuje umiestnenie a typ alternatívnych mediálnych prostriedkov pre , , . Kontajner pre inline prvky. Dá sa použiť na formátovanie pasáží textu, ako je zvýraznenie jednotlivých slov. Zvýrazňuje text a zvýrazní ho tučným písmom. Obsahuje vložiteľné štýly. Určuje dolný index písanie symbolov, napríklad index prvkov v chemických vzorcoch. Vytvorí viditeľný názov pre značku. Zobrazený s vyplneným trojuholníkom, kliknutím naň môžete zobraziť podrobnosti o titule. Určuje horný index pravopisu znakov.

  Cheat list so značkami

  Pre uľahčenie používania som značky zoskupil do tematických sekcií a pridal hodnoty vlastností zobrazenia pre každú značku. Ak chcete prejsť na tabuľku, kliknite na obrázok.

  Obsah:

  Dobrý deň, milí čitatelia blogu. V minulom článku som sa pozrel na blokové značky na štruktúrovanie textu. A dnes sa pozrieme na dizajn textu html stránky, t.j. Pozrime sa na značky, ktoré pomôžu zvýrazniť dôležité časti textu, aby na ne upútali pozornosť návštevníkov. Naučíme sa tiež vkladať do stránky špeciálne znaky.

  Výber fragmentov textu. Značky silné a em.

  Najdôležitejším nástrojom HTML používaným na zvýraznenie dôležitých častí textu je značka. To robí text tučným. Značka môže tiež zvýrazniť text tučným písmom. Hoci sú značky svojím účinkom podobné, nie sú ekvivalentné. Značka je fyzická značkovacia značka a jednoducho robí text tučným. A je logická značkovacia značka a označuje dôležitosť vybraného textu. Tag je dôležitejší pri optimalizácii webu pre vyhľadávače a jeho obsah má pre vyhľadávače väčšiu váhu.

  Značky sa používajú na zvýraznenie fragmentov textu kurzívou. A . Obsah týchto značiek je zobrazený pod uhlom simulujúcim ručne písané písmo.
  Pri vývoji webových stránok sa značky a častejšie používajú na zvýraznenie textu ako značky a . Príklad použitia značiek , a pre formátovanie textu:

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

  A vyzerá to takto:

  Aplikujme na našu stránku značky z predchádzajúcich článkov:

  Web o autách.
  

  Vitajte na našej automobilovej stránke. Tu nájdete veľa zaujímavých a užitočných článkov o autách, ich technických vlastnostiach a vlastnostiach.

  
  

  Vo vedeckom jazyku je auto:

  
  

  Mechanické motorové bezkoľajové cestné vozidlo s najmenej 4 kolesami.

  
  
  Klasifikácia auta
  

  Autá sú nasledujúcich typov:

  
  
  
  
  • Osobný automobil;
  
  
  • náklad;
  
  
  • SUV;
  
  
  • Buggy;
  
  
  • Zdvihnúť;
  
  
  • Šport;
  
  
  • Preteky.
  
  

  výsledok:

  

  Okrem prvkov , , a HTML má veľa značiek na formátovanie textu dokumentu HTML. Tu je krátky zoznam takýchto značiek:

  • - Skratka. v predvolenom nastavení sa v prehliadači zobrazuje podčiarknuté;
  • — Skratka. Naproti tomu skratka označuje ustálenú skratku. Zobrazuje sa podčiarknuté;
  • — malý citát zobrazený kurzívou;
  • — fragment zdrojového kódu programu zobrazený jednopriestorovým písmom;
  • — označí text, ktorý bol odstránený z webovej stránky a zobrazí sa preškrtnutý;
  • — označuje nový výraz v dokumente zobrazený kurzívou;
  • — používa sa na zvýraznenie textu, ktorý bol pridaný do novej verzie dokumentu a zobrazuje sa podčiarknutý;
  • — používa sa na zvýraznenie údajov zadaných z klávesnice alebo názvov kláves zobrazených jednopriestorovým písmom;
  • — používa sa na zvýraznenie úvodzoviek, obsah sa automaticky umiestni do úvodzoviek;
  • — označuje výstup údajov programom, zobrazený jednopriestorovým písmom;
  • - v skutočnosti to isté ako , len je to fyzická značka a logická značka. zobrazené jednopriestorovým písmom;
  • — zvýraznenie názvu premennej v zdrojovom kóde programu, zobrazené kurzívou.

  A takto sa zobrazujú v prehliadači:

  

  Zalomenie riadkov

  Ako sme sa dozvedeli z predchádzajúcich článkov, prvky bloku sa používajú na preklad reťazcov, najmä značky

  Zvýrazňujúci odsek.

  Umiestnime informácie o autorských právach na našu webovú stránku:

  Všetky práva vyhradené. rok 2013.

  
  

  Web o autách.

  výsledok:

  

  A ako vidíme, čiary sú oddelené príliš veľkou vzdialenosťou, akoby spolu nemali nič spoločné. V tomto prípade je lepšie použiť značku na prerušenie čiar
  . Táto značka nastavuje zalomenie riadku, ale na rozdiel od

  Nenastaví odsadenie riadku. Aplikujme značku
  na našej stránke:

  Všetky práva vyhradené. rok 2013.
  Web o autách.

  Toto je oveľa lepšie:
  
  

  Preto v niektorých prípadoch pri formátovaní textu html stránky nezabudnite na značku
  .

  Vkladanie špeciálnych znakov. Doslovy.

  Niekedy potrebujete do webovej stránky vložiť nejaký špeciálny znak, napríklad tieto znaky: , ©. Literály sa používajú na vkladanie špeciálnych znakov do HTML. je postupnosť znakov, ktorá začína & a končí ; , a medzi nimi je umiestnená postupnosť písmen - kód symbolu. Na vloženie symbolov © sa teda používajú nasledujúce literály: Všetky programy->Príslušenstvo->Nástroje->Tabuľka symbolov“ alebo stlačte WIN+R a do okna napíšte „vykonať charmap“. Zobrazí sa okno Tabuľka symbolov.

  

  Ak v zozname symbolov vyberiete znak, ktorý nemožno zadať z klávesnice, v stavovom riadku na ľavej strane sa zobrazí nápis ako „Kláves: Alt+“. Vezmite tento znakový kód a vložte ho do doslovu. Napríklad vložme na našu stránku symbol © pomocou kódu symbolu. Tento symbol vyberieme v „Tabuľke symbolov“ a v stavovom riadku na ľavej strane vidíme nápis „Kľúč: Alt+0169“. Vezmeme kód „0169“ a namiesto doslovného kódu na našej webovej stránke vložíme ©:

  Všetky práva vyhradené. © 2013.
  Web o autách.

  A dbáme na to, aby sa všetko na stránke zobrazovalo správne.

  To je všetko, čo mám na dnes. Ako vždy zhrniem:

  Ak chcete zalomiť riadky bez zarážok, použite značku
  ;

  a na vkladanie špeciálnych znakov používame literály ako: &; alebo & .

  V ďalšom článku vám poviem, ako vkladať obrázky na stránku, takže odporúčam

  Na označovanie textu v html sa používa sada značiek, ktorá umožňuje rozdeliť text na logické časti, zamerať pozornosť čitateľa na jeho jednotlivé časti a tiež optimalizovať obsah pre ľahšie porozumenie vyhľadávacím robotom, čo vedie k zlepšeniu hodnotenia. textovej stránky vo výsledkoch vyhľadávania pre kľúčové dopyty.

  Chcel by som hneď poznamenať, že všetky prvky formátovania textu, o ktorých sa hovorí v tomto článku (okrem br), sú spárované. To znamená, že na orámovanie obsahu tagom musí byť prítomný úvodný tag aj záverečný Your_tag>. Príklad:

  < h3>Správne napísaný názov textu< p>Odsek so zalomením riadku v strede odseku.< br>Príklad použitia nespárovanej značky vo vnútri spárovanej značky.

  Tvorba textovej štruktúry (blokové prvky). Značky nadpisov a odsekov.

  Značky h1-h6 sú zodpovedné za zvýraznenie textu vo forme nadpisov. O ich sémantickom vplyve a význame pre budovanie logickej štruktúry stránky pre vyhľadávače boli napísané podrobnejšie informácie.

  Stručne povedané, názvy stránok zohrávajú kľúčovú úlohu pri optimalizácii na stránke pre vyhľadávače. V tomto smere by sa znenie nadpisov na stránke malo čo najviac približovať kľúčovým dopytom, na ktoré sa chystáte propagovať článok vo výsledkoch vyhľadávania.

  Vizuálne sú nadpisy zvýraznené tučným písmom a veľkým písmom v porovnaní so zvyškom textu.

  Značka p je zodpovedná za zvýraznenie odsekov. Spolu so značkami názvu značkap je prvok dekorácie bloku textu, preto sa pri jeho použití každý nasledujúci odsek začína na novom riadku, čo sa pri použití vložených prvkov nestane.

  HTML značky pre textové značenie (vložené prvky)
  • span - podobný význam ako značka p, ale je to vložený prvok. Zvyčajne sa používa na označenie časti textu v odseku. Prečo je to potrebné? Všetko je celkom jednoduché – určenému textu možno neskôr priradiť dizajn pomocou CSS, ktorý sa líši od dizajnu zvyšku textu.
  • br - urobí zalomenie riadku. ŠTÍTOK NIE JE PÁROVANÝ (čiže nemá uzatváraciu značku). Približne to isté, ako keby ste vo Verde stlačili Enter. Na rozdiel od obalu vytvoreného blokovými prvkami nenesie žiadnu logickú záťaž. Používa sa výlučne na krajší dizajn textu. Odporúča sa vyhnúť sa jej používaniu, pokiaľ to nie je absolútne nevyhnutné, pretože v podstate jednoducho upcháva kód a na delenie slov v texte ho stačí rozdeliť na odseky.
  • silné – urobí písmo tučným. Slúži na umiestnenie logických dôrazov v texte pre vyhľadávacie roboty. Široko používaný na internú optimalizáciu textu. Odporúča sa, aby kľúčové frázy v texte boli orámované v tomto tagu, aby robot lepšie pochopil, o čom je článok. POZOR! Je dôležité to nepreháňať - ak sa podobné klávesy objavia v texte viac ako 3-5 krát, potom to možno považovať za prílišnú optimalizáciu textu a stránka s textom bude vo výsledkoch vyhľadávania znížená.
  • b - vizuálne sa nelíši od silného, ​​ale nenesie žiadne sémantické zaťaženie pre vyhľadávací nástroj. Používa sa na zvýraznenie častí textu výlučne pre tých, ktorí ho budú čítať. Napríklad, ak potrebujete zvýrazniť frázu, ktorá neobsahuje kľúčové slová, ale môže používateľovi uľahčiť pochopenie štruktúry textu.
  • em - zmení text vnútri značky kurzívou. Rovnako ako strong slúži na internú optimalizáciu textu pre propagáciu vo vyhľadávačoch, len má v porovnaní s ním menšiu váhu.
  • i - vizuálne sa nelíši od . Nenesie žiadnu sémantickú záťaž pre roboty, používa sa na uľahčenie čítania textu pre používateľov. Podobne ako pri značke, len pre kurzívu.
  • ins – používa sa na podčiarknutie textu. Zvýrazňuje text pre používateľa aj pre vyhľadávací nástroj.
  • u - vizuálne identické s predchádzajúcou značkou. Zvýrazňuje text iba pre používateľa.
  • tt - zobrazuje text v jednopriestorovom písme. Nenesie žiadnu sémantickú záťaž. Monospace znamená, že všetky znaky v písme používajú pri písaní rovnaký priestor.
  • predblokový prvok. Používa sa na vytvorenie veľkých častí textu s jednotnou medzerou. V jeho vnútri môžete na formátovanie textu použiť ľubovoľné značky okrem sub a sup.
  • sub - zobrazí text ako dolný index (zmenší písmo textu a zobrazí ho mierne pod úrovňou riadku).
  • sup - zobrazí text ako horný index (zmenší písmo textu a zobrazí ho mierne nad úrovňou riadku).
  • štrajk (s) – prečiarkne text. Tieto dve značky sú si obsahovo úplne podobné. Moderná html dokumentácia vo všeobecnosti odsudzuje ich použitie a hovorí, že CSS možno použiť na prečiarknutie textu a tieto značky jednoducho upchajú kód.

  Použitie viacerých značiek naraz

  Oboznámili sme sa so základnými značkami na formátovanie textu. Môžu byť použité nielen samostatne, ale aj jeden vo vnútri druhého, hlavnou vecou je pamätať na základný princíp vkladania štítkov - štítok, ktorý bol otvorený ako prvý, by mal byť zatvorený ako posledný. Myslím:

  Značky umiestnené vo vnútri iných značiek tvoria poradie vnorenia. Takže v uvažovanom príklade má značka i druhú úroveň vnorenia vzhľadom na značku p.

  POZNÁMKA! Vložené prvky vo vnútri prvkov bloku sú povolené, ale prvky bloku vo vnútri vložených prvkov nie. Hoci prehliadač zobrazí všetko správne, ak napríklad použijete značku p vo vnútri značky b. Z pohľadu html dokumentácie to nebude pravda. To znamená, že takýto kód bude obsahovať chybu a môžete to ľahko skontrolovať pomocou akejkoľvek služby na overenie kódu HTML.

  Otázky na sebaovládanie:
  • Ktoré značky formátovania textu sú blokové a ktoré sú vložené? Aký je medzi nimi rozdiel?
  • Aké sú spôsoby, ako urobiť text tučným? Aký je medzi nimi rozdiel?
  • Aké sú rôzne spôsoby napísania textu kurzívou? Aký je medzi nimi rozdiel?
  • Ako správne zalamovať riadky v html?
  • Ako sa určuje poradie vnorenia značiek?

  Aby ste mu dali špecifický štýl, musíte text umiestniť do príslušného kontajnera.

  Všetky formátovacie značky možno rozdeliť do troch skupín:

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

  2. Značky dizajnu hlavného textu ( , , , atď.).

  3. Zoskupovanie značiek (

  , ,
  )

  Značky titulkov

  Premieňajú bežný text na nadpis určitej úrovne. Značka vytvára nadpis prvej úrovne – najväčší a najdôležitejší (zvyčajne názov článku na stránke) a zodpovedá za nadpis šiestej úrovne – najmenší a najnenápadnejší. Tieto značky sú dôležité pre používateľov aj vyhľadávače – obaja milujú nadpisy s podnadpismi. Treba dodržať hierarchiu úrovní, to znamená ísť pozadu a nie naopak.

  Ak chcete pochopiť, ako to funguje, zadajte nasledujúci kód do súboru html:

  Nadpis prvej úrovne Nadpis druhej úrovne Nadpis tretej úrovne Nadpis štvrtej úrovne Nadpis piatej úrovne Nadpis šiestej úrovne

  V prehliadači to bude vyzerať takto:

  Značky dizajnu textu tela

  Umožňuje formátovanie na úrovni znakov. Pozrime sa, čo s nimi môžete robiť.

  Tučné písmo

  Je potrebné zamerať pozornosť na text. Je to dôležité aj pre vyhľadávače, ktoré dokážu zvýrazniť kľúčové slová.

  Značky a sú zodpovedné za výrazný štýl.

  Horný a dolný index

  Môžu byť použité vo vzorcoch, rovniciach a pri označovaní určitých veličín.

  Značka je zodpovedná za vytváranie spodných indexov a značka sa používa pre horné indexy.

  X1=32 m2

  Zmenšovanie

  Ak potrebujete, aby bol text o jeden menší, než je nastavená hodnota na celej stránke, musíte použiť značku

  Obyčajný text. Redukovaný text.

  Podčiarknite

  Tento typ zvýraznenia možno použiť na označenie zmien vykonaných v dokumente alebo jednoducho na upútanie pozornosti na text.

  Obyčajný text. Podčiarknutý text.

  Prečiarknuté

  Informácie môžete prečiarknuť, ak už stratili význam. Značka je na to určená.

  Kurzíva

  Je potrebné zamerať pozornosť na text a môže byť vytvorený pomocou značky alebo .

  Počítačové zadávanie textu

  Stáva sa, že potrebujete pridať zdrojový kód programu a výsledky jeho práce na webovú stránku. Na uľahčenie vizuálneho odlíšenia rôznych častí textu od seba vývojári HTML zaviedli značky tejto skupiny.

  Kontajner obsahuje kód programu, pričom jeho premenné sú zvýraznené značkou a výsledkom spustenia je . Kontajner obsahuje text, ktorý musí používateľ pri práci s programom zadať z klávesnice, a všetko, čo je uzavreté v tagoch, si zachováva pôvodný formát vrátane medzier navyše a zalomení riadkov.

  takže a, b, c, toto je výsledok spustenia programu a toto je text zadaný používateľom a zobrazí sa asi takto.

  Citáty a definície

  Kód programu bude vyzerať takto, premenné sú označené nasledovne: a, b, c, toto je výsledok spustenia programu a toto je text zadaný používateľom. Ponechanie pôvodného formátovania vyzerá asi takto.

  Citát v tagu blockquote. Citát v kontajneri citátu. Krátky citát s tagom q. Zvýraznená definícia. Skratka (mimovládna organizácia, individuálny podnikateľ).

  Všeobecný príklad

  Aby ste lepšie pochopili, za čo sú jednotlivé značky zodpovedné a ako fungujú, pozrite si nasledujúci kód a výsledok jeho vykonania.

  Tučný text možno vytvoriť pomocou značiek strong a b. Em a sú zodpovední za kurzívu. i.

  Tagy sub a sup sa používajú na vytváranie dolných indexov (x1...xn) a horných indexov (42=16). Del prečiarkne, ins podčiarkne.

  Značky kód, kbd, var a samp sa používajú zriedkavo a sú potrebné na zobrazenie výpisov programov

  abbr je potrebné na označenie skratiek (HTML). Tagy blockquote, cit a q sa používajú na navrhovanie citátov (Obloha dýchala už na jeseň)

  Predznačka zachováva pôvodné formátovanie textu bez odstránenia medzier alebo zlomov riadkov.

  Prehliadač interpretuje tento kód takto:

  

  Zoskupovanie značiek

  Je potrebné, aby text neplynul v jednom súvislom riadku, ale bol členený na logické zložky.

  • Vo vnútri značiek je odsek.

  Prvý odsek

  Druhý odsek

  

  • Tag
    presunie sa na ďalší riadok v rámci odseku (pred riadkom nebude žiadne odsadenie).
  • umožňuje nakresliť vodorovnú čiaru. Môžete ho použiť na jasnejšie oddelenie textu. Atribúty width, size, color, align a noshade špecifikujú šírku, hrúbku, farbu, zarovnanie a žiadny 3D efekt čiary.

  Čiara nad čiarou. Riadok pod riadkom.

  
  
  

  SÚVISIACE ČLÁNKY
  
  • Spätná väzba
  • Mapa stránok
  • O stránke
  
  
  

  Značka na vytvorenie tabuľky.
  	Definuje telo tabuľky.
  		Vytvorí bunku tabuľky.
  	Používa sa na deklarovanie fragmentov kódu HTML, ktoré možno naklonovať a vložiť do dokumentu pomocou skriptu. Obsah značky nie je jej potomkom.
  	Vytvára veľké polia na zadávanie textu.
  	Definuje pätu tabuľky.
  	Vytvorí názov bunky tabuľky.
  	Definuje názov tabuľky.
  	Definuje dátum/čas.
  	Názov dokumentu HTML, ktorý sa zobrazuje v hornej časti záhlavia prehliadača. Môže sa zobraziť aj vo výsledkoch vyhľadávania, takže to treba vziať do úvahy pri poskytovaní názvu.
  Vytvorí riadok tabuľky.
  	Pridáva titulky pre prvky a .
  	Zvýrazní pasáž textu podčiarknutím bez ďalšieho zvýraznenia.
  	Vytvorí zoznam s odrážkami.
  	Zvýrazňuje premenné z programov ich zobrazením kurzívou.
  	Pridá video súbory na stránku. Podporuje 3 video formáty: MP4, WebM, Ogg.
  	Označuje prehliadač, kde sa môže prerušiť dlhý riadok.