Ako odstrániť neprerušiteľné miesto v programe Word. Používanie bielych znakov na formátovanie kódu HTML, nedeliteľných medzier a iných špeciálnych znakov (mnemotechniky)

Dobrý deň, milí čitatelia blogu. O niečo skôr sme sa už stihli porozprávať o tom, ako sme sa v ňom dozvedeli aj o dizajne. Dnes máme zase koncept medzery v HTML, ako aj formátovanie kódu, ktorý je s ním spojený pri jeho písaní (pre pohodlie jeho následného čítania a vnímania).

No a vzhľadom na to, že sa dotkneme témy nedeliteľnej medzery a mäkkého delenia slov, budeme musieť zamerať svoju pozornosť na takzvané špeciálne znaky alebo mnemotechnické pomôcky používané v jazyku Html, ktoré vám umožnia pridať veľa ďalších znakov do kódu webového dokumentu, ako je už spomenutý vyššie . Ale prvé veci.

Medzery a medzery v jazyku HTML

Predtým, ako prejdem k problematike formátovania textu pomocou značiek špeciálne navrhnutých na to (odsek, nadpisy atď.), Chcem sa pozastaviť nad tým, ako sa medzery, zalomenia riadkov (Enter) a tabulátory interpretujú v jazyku HTML. , ako sa rozdelenie vykonáva text v okne prehliadača pri zmene veľkosti.

Je pravda, že na tento druh vizuálneho formátovania (ktoré na webovej stránke nebude viditeľné) sa najčastejšie nepoužívajú samotné medzery, ale znaky tabelácie a zalomenia riadkov. Existuje také pravidlo - keď začnete písať vnorenú značku Html, potom odsadenie s tabulátorom(kláves Tab na klávesnici) a keď zatvoríte túto značku, odstráňte zarážku (kombinácia kláves Shift + Tab na klávesnici).

Musíte to urobiť tak, aby otváracie a zatváracie značky boli na rovnakej vertikálnej úrovni (rovnaký počet kariet od pravého okraja stránky vášho HTML editora, napríklad Notepad ++, o ktorom som písal). Okrem toho vám odporúčam urobiť niekoľko zalomení riadkov hneď po napísaní úvodného prvku a okamžite napísať záverečný prvok na rovnakej úrovni (počet tabulátorov), aby ste to nezabudli urobiť neskôr.

Tie. otvárací a zatvárací prvok by mal byť vertikálne na rovnakej úrovni a interné tagy posunieme o jeden znak tabulátora a uzatváracie a otváracie prvky umiestnime opäť na rovnakú úroveň.

Pri jednoduchých webových dokumentoch sa to môže zdať prehnané, no pri vytváraní viac či menej zložitých áno kód bude oveľa prehľadnejší a čitateľný vďaka množstvu medzier a tiež v ňom bude oveľa ľahšie badať chyby vďaka symetrickému usporiadaniu tagov.

Špeciálne znaky alebo mnemotechnické pomôcky v kóde Html

Poďme si teda teraz niečo povedať o takzvaných špeciálnych znakoch, ktorých použiteľnosť som avizoval na začiatku tohto článku. Špeciálne znaky sa tiež niekedy nazývajú mnemotechnické pomôcky alebo náhrady. Sú určené na vyriešenie problému, ktorý sa v hypertextovom značkovacom jazyku vyskytoval už dlhú dobu v súvislosti s použitým kódovaním.

Keď zadávate text z klávesnice, znaky vášho jazyka sú zakódované podľa vopred určeného algoritmu a následne sú zobrazené na stránke pomocou písiem, ktoré používate (kde ich nájsť a ako ich nainštalovať) kvôli dekódovaniu.

Existuje veľa kódovaní, ale pre jazyk Html bola štandardne prijatá rozšírená verzia kódovania.

V tomto kódovaní textu bolo možné zapísať iba 256 znakov - 128 z ASCII a ďalších 128 pre písmená ruského jazyka. V dôsledku toho sa vyskytol problém s používaním znakov na stránkach, ktoré nie sú zahrnuté v ASCII a nie sú to ruské znaky, ktoré sú súčasťou kódovania Windows 1251 (CP1251). No, vzali ste si do hlavy, aby ste použili vlnovku alebo apostrof, ale kódovanie používané jazykom Html spočiatku také schopnosti nemá.

Práve pre takéto prípady boli vynájdené substitúcie, alebo inými slovami, mnemotechnické pomôcky. Na začiatku špeciálne znaky boli číselné, ale potom pre najbežnejšie z nich boli pridané ich abecedné náprotivky, aby si ich ľahšie zapamätali.

Všeobecne povedané, mnemotechnická pomôcka je znak, ktorý začína znakom „&“ a končí bodkočiarkou „;“. Práve z tohto dôvodu prehliadač pri analýze Html kódu z neho extrahuje špeciálne znaky. Za ampersandom v číselnom substitučnom kóde musí bezprostredne nasledovať znak libry „#“, ktorý sa niekedy nazýva aj hash. A až potom nasleduje číselný kód požadovaného znaku v kódovaní Unicode.

V Unicode je možné napísať viac ako 60 000 znakov – hlavná vec je, že mnemotechnický symbol, ktorý potrebujete, je podporovaný fontom použitým na vašej stránke. Existujú písma, ktoré podporujú takmer všetky znaky Unicode, a existujú možnosti len s určitou sadou znakov.

Úplný zoznam špeciálnych postáv bude jednoducho obrovský, ale najčastejšie používané mnemotechnické pomôcky môžete si požičať napríklad z tejto tabuľky:

Je tam celkom zaujímavé spôsob, ako získať Html kód mnemotechnických pomôcok pre postavu, ktorú potrebujete. Na to bude stačiť otvoriť editor Microsoft Word, vytvoriť nový dokument a z horného menu vybrať "Vložiť" - "Symbol" (používam verziu 2003, takže neviem ako urobiť podobný prevádzka v neskorších verziách).

V okne, ktoré sa otvorí, musíte vybrať písmo, napríklad Times New Roman (alebo akékoľvek iné, ktoré bude určite prítomné na väčšine počítačov návštevníkov vašej stránky - napríklad Courier alebo Arial).

Pridajte všetky špeciálne znaky, ktoré potrebujete, zo zoznamu, ktorý sa otvorí do vášho dokumentu programu Word, a uložte tento dokument programu Word ako webovú stránku (vybratú z rozbaľovacieho zoznamu „.html“ pri ukladaní). Potom stačí otvoriť túto webovú stránku v akomkoľvek HTML editore (rovnaký Notepad ++ je v poriadku) a uvidíte všetky digitálne kódy mnemotechnických pomôcok, ktoré potrebujete:

Metóda je trochu komplikovaná, ale ak cítite nutkanie použiť na stránke vášho webu nejaký vzácny špeciálny znak, potom to bude jednoduchšie ako hľadať tabuľky na internete, ako je tá vyššie. Výsledný kód špeciálneho znaku budete musieť vložiť na správne miesto a namiesto neho na webovej stránke prehliadač zobrazí znak, ktorý potrebujete (napríklad nezalomiteľnú medzeru).

Nedeliteľná medzera a jemné delenie slov v príkladoch

Ako som spomenul vyššie a ako môžete vidieť z tabuľky špeciálnych znakov uvedenej hneď vyššie, niektoré mnemotechnické pomôcky v Html dostali okrem digitálneho aj symbolické označenie pre ich ľahšie zapamätanie. Tie. namiesto znaku libry "#" (hash) vo variantoch znakov sa používajú slová. Napríklad tá istá nezalomiteľná medzera môže byť napísaná buď ako (digitálna mnemotechnická pomôcka) alebo ako (znak).

Ak pri písaní článkov potrebujete vložiť ampersand (&) alebo otvorenú hranatú zátvorku (<), то для этого обязательно нужно использовать спецсимволы. Дело в том, что эти знаки в Html означают начало тега и браузер будет рассматривать их именно с этой точки зрения и отображать в тексте не будет.

Teda ak píšete článok, do ktorého budete potrebovať vložiť do textu napríklad display tag< body>inak stačí vložiť znamienko menšie ako (<), то сделав это без использования подстановок на веб странице вы ничего не увидите, т.к. браузер, обнаружив «<» , поймет, что это Html тег, а не текст статьи.

Preto na vyriešenie takéhoto problému budete musieť vložiť nasledujúcu konštrukciu:

To isté platí pre zobrazenie kódu samotných mnemotechnických pomôcok, pretože začínajú znakom ampersand. Do textu budete musieť vložiť kód s nahradením znaku ampersand jeho náhradou (špeciálny znak):

Toto bude potrebné urobiť, aby ste sa dostali na stránku<, а не отображение левой угловой скобки (<), в которую преобразует браузер мнемонику <, обнаружив при разборе знак амперсанда. Хитро, но вы все поймете попробовав это на практике.

Taktiež s najväčšou pravdepodobnosťou využijete nezalomiteľnú medzeru, ktorá bude vyzerať ako bežná medzera na webovej stránke, ale prehliadač ju vôbec nebude považovať za medzeru a neprenesie cez to(toto by bolo vhodné napríklad pre frázy ako 1400 GB atď., pri ktorých by nebolo vhodné uvádzať spojovník na rôznych riadkoch):

1400 GB.

Niekedy môže nastať opačná situácia, keď text obsahuje veľmi dlhé slová a chcete sa uistiť, že v prípade potreby aj prehliadač mohol tieto slová prelomiť prestupom. Na tieto účely sa poskytuje špeciálny symbol „soft transfer“ -

Dlhé, dlhé slovo;

Keď bude potrebné prejsť na iný riadok, prehliadač vloží spojovník namiesto mnemotechnického znaku „soft wrap“ a zvyšok slova odošle na ďalší riadok. Ak je dostatok miesta na umiestnenie všetkých týchto slov na jeden riadok, prehliadač nenakreslí žiadny nový riadok. To je všetko, je to jednoduché.

Veľa šťastia! Uvidíme sa čoskoro na stránkach blogu

Ďalšie videá si môžete pozrieť na stránke

Možno vás bude zaujímať

MailTo - čo to je a ako vytvoriť e-mailový odkaz v Html
Značky a atribúty nadpisov H1-H6, vodorovný riadok Hr, zalomenie riadka Br a odsek P podľa normy Html 4.01
Ako vložiť odkaz a obrázok (fotku) do HTML - IMG a A tagy

Dobrý deň, milí čitatelia blogu! Tí, ktorým sa aspoň povrchne podarilo zoznámiť, už pravdepodobne vzali na vedomie, aj keď všeobecne. To znamená, že majú predstavu o tom, aké HTML znaky sa vo všeobecnosti používajú v kóde dokumentu.

V dnešnom článku sa pokúsime zistiť, čo je medzera v HTML, v ktorých prípadoch môžete použiť medzery pri formátovaní samotného kódu pre ľahké vnímanie. Dozvieme sa, kedy je potrebné použiť nezalomiteľnú medzeru, a tiež sa zoznámime s ďalšími špeciálnymi znakmi (alebo, ako sa im hovorí, mnemotechnickými pomôckami).

V skutočnosti by som vám odporučil neignorovať tému používania rôznych špeciálnych znakov, pretože ide o dôležitý komponent na dokončenie štúdia hypertextového značkovacieho jazyka. Vo všeobecnosti informácie uvedené v tejto publikácii určite nebudú zbytočné. No a teraz k veci.

Medzery a medzery v HTML

Najprv je potrebné urobiť dôležitú poznámku. Na klávesnici počítača sú špeciálne klávesy, ktoré vám umožňujú implementovať oddelenie textu (viac o tom nižšie). Avšak iba široký medzerník poskytuje oddelenie medzi slovami, a to nielen v editore, ale aj v okne prehliadača. Pri ovíjaní čiar a odsadzovaní od okraja sú nuansy.

Ako viete, zobrazenie určitých prvkov vo webovom prehliadači je určené značkami. Na formátovanie textu sa používa dobre známy , ktorý je založený na blokoch. To znamená, že jeho obsah je umiestnený po celej dostupnej šírke.

Komu zalomiť riadky v odseku P, musíte použiť jednu značku BR, pomocou ktorej sa to dá urobiť. Povedzme, že potrebujeme do textu vložiť riadky z básne, ktorú píšeme v textovom editore:

Napriek tomu, že riadky verša sú umiestnené správne a pomlčky sú na správnych miestach, v prehliadači bude všetko vyzerať inak:

Ak chcete dosiahnuť rovnaké zobrazenie v okne webového prehliadača, musíte na každom zlome riadku napísať BR:

Teraz sme splnili úlohu a v prehliadači sa poetické riadky zobrazia celkom správne:

Tým sa dokončia potrebné zalomenia riadkov. Tu je potrebné upozorniť aj na takú vlastnosť, že viacero za sebou nasledujúcich medzier zobrazuje webový prehliadač ako jeden. Môžete si to overiť, ak sa v tom istom editore pokúsite vložiť medzi dve slová nie jednu, ale niekoľko medzier a kliknutím na tlačidlo „Uložiť“ sa pozriete na výsledok v prehliadači.

Medzera, tabulátor a zalomenie riadku

V podstate s týmito medzery spoznáme sa hneď, ako začneme pracovať s textom v editore a naformátujeme ho správnym spôsobom. Na implementáciu takejto úlohy existujú špeciálne klávesy, z ktorých každý zodpovedá svojmu vlastnému znaku medzery:

• Medzerník - najširší kláves na klávesnici počítača (bez nápisu);
• Tabuľka - kláves vľavo s nápisom "Tab" a dvoma šípkami smerujúcimi rôznymi smermi;
• Zalomenie riadku - kláves "Enter".

Ako som však uviedol vyššie, konečný požadovaný výsledok získame nielen v textovom editore, ale aj v prehliadači iba pri použití prvého kľúča. Všetky tri klávesy (vrátane tabulátora a zlomu riadka) sú užitočné pri formátovaní kódu HTML. Povedzme, že takto vyzerá fragment kódu v programe Poznámkový blok ++ (vysvetľujúci materiál o tomto editore), keď sú zobrazené všetky medzery:

Získame kód, ktorý je vďaka medzerám ľahko čitateľný a zrozumiteľný. Oranžové šípky označujú zarážky vytvorené klávesom Tab a znaky CR a LF označujú zlomy riadkov vykonané klávesom Enter.

Vnorené kontajnery sú viditeľné, otváracie a zatváracie štítky dobre vyniknú. V tejto forme je možné tento kód jednoducho upravovať. Teraz ho porovnajte s rovnakým kódom, ktorý nemá takéto oddelenie textu:

Rovnakým spôsobom pomocou prázdnych znakov môžete napísať pravidlá CSS, ktoré budú vizuálne vyzerať zrozumiteľne a stráviteľne:

Po privedení všetkých štýlov do spoločného menovateľa a úplnom dokončení úprav súboru štýlov ho môžete podriadiť odstránením všetkých medzier z kódu. Toto je potrebné zvýšiť, čo je veľmi dôležité pri propagácii zdroja.

Špeciálne znaky (alebo mnemotechnické pomôcky) v kóde HTML

Teraz sa pozrime na prípady, v ktorých je potrebné použiť špeciálne znaky, ktoré som spomenul na začiatku článku. Špeciálne znaky HTML, niekedy označované ako mnemotechnické pomôcky, boli zavedené na vyriešenie dlhodobého problému s kódovaním v hypertextovom značkovacom jazyku.

Pri písaní textu na klávesnici sa zakódujú znaky jazyka, ktorý používate. Vo webovom prehliadači bude napísaný text vykreslený vo fontoch, ktoré si vyberiete v dôsledku operácie spätného dekódovania.

Faktom je, že existuje veľa takýchto kódovaní, teraz ich nemáme za cieľ podrobne analyzovať. Len každému z nich môžu chýbať určité znaky, ktoré však treba zobraziť. Povedzme, že máte chuť písať jednoduché úvodzovky alebo znak s diakritikou a tieto ikony v súprave chýbajú.

S cieľom odstrániť tento problém bol zavedený systém špeciálnych znakov, ktorý zahŕňa obrovské množstvo rôznych mnemotechnických pomôcok. Všetky začínajú znakom „&“ a zvyčajne končia bodkočiarkou „;“. Najprv mal každý špeciálny znak svoj vlastný digitálny kód. Napríklad pre medzeru, ktorú budeme podrobnejšie analyzovať nižšie, bude platiť nasledujúca položka:

Ale po určitom čase boli najbežnejším symbolom priradené doslovné náprotivky (mnemotechnické pomôcky), aby boli ľahšie zapamätateľné. Povedzme, že pre rovnaký pevný priestor to vyzerá takto:

Výsledkom je, že prehliadač zobrazí zodpovedajúci znak. Zoznam mnemotechnických pomôcok je veľmi rozsiahly, najčastejšie používané špeciálne znaky v HTML nájdete v nasledujúcej tabuľke:

Prípady použitia niektorých špeciálnych znakov vrátane nerozdeliteľnej medzery a mäkkého spojovníka

Ak ste si už tabuľku trochu preštudovali, dostali ste potvrdenie o slovách, ktoré som povedal vyššie, že na zobrazenie všetkých špeciálnych znakov sa používa číselný kód () alebo jeho abecedný analóg (mnemotechnický znak), kde sú napísané písmená (). namiesto kombinácie mriežky a čísel.

Teraz sa pozrime, kedy je potrebné tieto kódy použiť. Povedzme, že v článku potrebujete zadať nejakú značku HTML na informačné účely, napr.