Nu toate caracterele pe care le vedeți pe tastatură pot fi folosite în textul unui document HTML. Totuși, acest lucru este logic. Dacă fiecare etichetă începe cu caracterul (<) и заканчивается символом (>), atunci este destul de logic că aceste caractere nu pot fi specificate în textul obișnuit. Aceste caractere au o semnificație specială în documentele HTML. Când browserul le vede, crede că sunt etichete HTML și încearcă să le interpreteze ca atare.
Pentru a rezolva problema adăugării de caractere care sunt interzise pentru introducerea în textul unui document HTML, a fost dezvoltat un set de caractere speciale - secvențe care înlocuiesc caracterele care sunt interzise pentru a introduce de la tastatură. Caracterele care nu sunt prezente pe tastatură pot fi, de asemenea, înlocuite cu caractere speciale. Fiecare astfel de secvență (legatură mnemonică) trebuie să înceapă cu un caracter și (&) și să se termine cu un punct și virgulă (;). Între (&) și (;) puteți introduce:

• numele caracterului special (&name;);
• un cod numeric care este introdus după semnul (), adică atunci când tastați un caracter special prin specificarea codului numeric al acestuia, trebuie să utilizați următoarea intrare: (&code;);

Spațiu care nu se rupe

Scopul principal al unui spațiu care nu se sparge () (din spatiu de nerupere) — cuvinte separate, dar interziceți o nouă linie în acest moment. Deoarece dimensiunea ferestrei browserului nu este constantă, noua linie dintr-un paragraf apare automat. În acest caz, browserul va întrerupe linia în orice loc unde există un spațiu sau o cratimă. Conform regulilor de ortografie, există structuri lingvistice care nu pot fi sparte. Construcțiile cu un spațiu fără rupere, de exemplu, includ:

• nume de familie cu inițiale;
• em liniuțe precedate de un cuvânt;
• cuvinte monosilabice urmate de un cuvânt;
• numere urmate de unități de măsură.

• 15 m/s
• 100 km/h

După cum știți deja, în HTML, mai multe spații regulate consecutive sunt înlocuite cu un singur spațiu. Dacă scrieți 10 spații în text, browserul va elimina 9 dintre ele. Pentru a adăuga spații reale în text, puteți utiliza un spațiu care nu se rupe () .

Citate.

În tipărire, există trei tipuri de ghilimele: ghilimele duble de colț sau ghilimele „în ghilimele” (“ ”), ghilimele tipografice (“ ”) și ghilimele „picior” scrise de mână (“ ”). Când lucrați cu coduri de program, veți folosi ghilimele drepte duble (" ") și ghilimele drepte simple (" ").
Potrivit tradiției, principalul tip de ghilimele în limba rusă sunt „pomii de Crăciun”. În HTML, brazii de Crăciun corespund simbolurilor « Și » . În multe publicații, ghilimele tipografice și ghilimelele duble drepte sunt, de asemenea, folosite în loc de ghilimele.
Ghilimelele tipografice din stânga și din dreapta corespund simbolurilor “ Și ” în consecință, și ghilimele din stânga jos - „ .
Ghilimele duble directe corespund unui caracter special " .

Utilizarea caracterelor speciale de ghilimele este prezentată în următorul exemplu:

Exemplu: Utilizarea ghilimelelor

Cratima și liniuță.

În tipărire, există trei caractere foarte asemănătoare: liniuța em, liniuta en și cratima. Dintre acestea, există doar una pe tastatura computerului - cratima. Acesta este ceea ce se folosește de obicei în toate cazurile când trebuie introdusă o cratimă sau o liniuță în text. Cu toate acestea, trebuie respectate anumite reguli de punctuație privind utilizarea acestor semne.
Astfel, cratima (-) este folosită numai în cuvinte sau între numere. O liniuță em (—) este plasată între cuvintele dintr-o propoziție și este separată de aceste cuvinte prin spații. Linia em corespunde unei legături mnemonice — . Linia en (-) este folosită între numere fără litere sau între cuvinte cu majuscule și este, de asemenea, folosită ca semn minus în formulele matematice. Nu există spațiu între liniuța en și cuvinte. liniuța en corespunde unei legături mnemonice - .

Utilizarea unei cratime și a unei liniuțe este prezentată în următorul exemplu:

Exemplu: caractere speciale - și -

• Incearca-l tu insuti "

Timpul inseamna bani...

Pagina web durează prea mult să se deschidă.
Ar trebui să se încarce în 2-4 secunde.
Timpul inseamna bani...

Lista unor caractere speciale HTML populare

Tipuri de caractere speciale

Pe o tastatură obișnuită nu veți găsi cele mai multe caractere matematice, tehnice, geometrice și alte caractere speciale.
Pentru a aplica astfel de simboluri într-o pagină HTML, puteți folosi numele lor mnemonice corespunzătoare.

Următorul exemplu arată cum același simbol poate fi afișat folosind coduri diferite.

Bună ziua, dragi cititori ai site-ului blogului. Puțin mai devreme, am reușit deja să vorbim despre asta și am aflat și despre designul din acesta. Astăzi avem la rândul său conceptul de spațiu alb în HTML, precum și formatarea codului asociată atunci când îl scriem (pentru comoditatea citirii și percepției sale ulterioare).

Ei bine, datorita faptului ca vom atinge tema spatiului nerupere si a silabei soft, va trebui sa ne concentram atentia asupra asa-ziselor caractere speciale sau mnemonice folosite in limbajul Html, care va vor permite sa adaugati multe caractere suplimentare la codul documentului web, cum ar fi cele deja menționate mai sus. Dar mai întâi lucrurile.

Spații și caractere albe în HTML

Înainte de a trece la problema formatării textului folosind etichete special concepute pentru acest lucru (paragraf, titluri etc.), vreau să mă opresc asupra modului în care sunt interpretate spațiile, întrerupțiile de rând (Enter) și tabularea în limbajul HTML și cum este ruperea. a efectuat text în fereastra browserului când este redimensionat.

Adevărat, pentru acest tip de formatare vizuală (care nu va fi vizibilă pe pagina web), cel mai adesea nu spațiile în sine sunt folosite, ci mai degrabă caracterele de tabulație și de ruptură de linie. Există o astfel de regulă - atunci când începeți să scrieți o etichetă HTML imbricată, atunci indentare folosind file(Tasta Tab de pe tastatură), iar când închideți această etichetă, eliminați indentarea (combinația de taste Shift+Tab de pe tastatură).

Acest lucru trebuie făcut astfel încât etichetele de deschidere și de închidere să fie la același nivel vertical (la același număr de file din marginea dreaptă a paginii în editorul dvs. HTML, de exemplu, Notepad++, despre care am scris). În plus, vă sfătuiesc să faceți imediat după ce ați scris elementul de deschidere să faceți mai multe întreruperi de linie și să o scrieți imediat pe cea de închidere la același nivel (număr de file), astfel încât să nu uitați să faceți acest lucru mai târziu.

Acestea. elementele de deschidere și de închidere ar trebui să fie la același nivel pe verticală, iar etichetele interne ar trebui să fie deplasate cu un caracter de filă, iar elementele de închidere și deschidere ar trebui să fie plasate din nou la același nivel.

Pentru documente web simple, acest lucru poate părea exagerat, dar atunci când creați documente mai mult sau mai puțin complexe, acestea codul va deveni mult mai clarși lizibilă datorită abundenței de spații și, de asemenea, va fi mult mai ușor de detectat erorile datorită dispoziției simetrice a etichetelor.

Caractere speciale sau mnemonice în codul HTML

Deci, acum să vorbim despre așa-numitele personaje speciale, a căror ușurință în utilizare am anunțat-o la începutul acestui articol. Caracterele speciale sunt uneori numite mnemonice sau substituții. Acestea sunt menite să rezolve o problemă care a apărut de mult timp în limbajul de marcare hipertext, legată de codificările folosite.

Când introduceți text pe tastatură, caracterele limbii dvs. sunt codificate după un algoritm prestabilit, iar apoi sunt afișate pe site folosind fonturile pe care le utilizați (unde să găsiți și cum să instalați pentru site) datorită decodării.

Există o mulțime de codificări, dar pentru limbajul HTML versiunea extinsă a codificărilor a fost adoptată implicit.

În această codificare a textului a fost posibil să se scrie doar 256 de caractere - 128 din ASCII și alte 128 pentru litere rusești. Ca urmare, a apărut o problemă cu utilizarea pe site-uri a caracterelor care nu sunt incluse în ASCII și nu sunt litere rusești care fac parte din codificarea Windows 1251 (CP1251). Ei bine, ai decis să folosești o tilde sau un apostrof, dar o astfel de posibilitate nu a fost inclusă inițial în codificarea folosită de limbajul HTML.

Pentru astfel de cazuri au fost inventate substituțiile sau, cu alte cuvinte, mnemonicii. Inițial caracterele speciale aveau o formă digitală, dar apoi pentru cele mai comune au fost adăugate omologii lor de scrisori pentru a le face mai ușor de reținut.

În termeni generali, un mnemonic este un caracter care începe cu un „&” și se termină cu un punct și virgulă „;”. Pe baza acestor caracteristici browserul, atunci când analizează codul HTML, extrage caractere speciale din acesta. Ampersand din codul numeric wildcard trebuie imediat urmat de semnul lire sterline „#”, numit uneori hash. Și abia apoi urmează codul digital al caracterului dorit în codificarea Unicode.

Mai mult de 60.000 de caractere pot fi scrise în Unicode - principalul lucru este că simbolul mnemonic de care aveți nevoie este susținut de fontul folosit pe site-ul dvs. Există fonturi care acceptă aproape toate caracterele Unicode și există opțiuni doar cu un anumit set de caractere.

Lista completă a personajelor speciale va fi pur și simplu uriașă, dar cele mai frecvent utilizate mnemonice puteți împrumuta de exemplu din acest tabel:

Există destul de interesant modalitate de a obține codul mnemonic HTML pentru semnul de care ai nevoie. Pentru a face acest lucru, trebuie doar să deschideți editorul Microsoft Word, să creați un document nou și să selectați „Inserare” - „Simbol” din meniul de sus (folosesc versiunea 2003, așa că nu știu cum să fac o operație similară în versiunile ulterioare ).

În fereastra care se deschide, trebuie să selectați un font, de exemplu, Times New Roman (sau orice altul care va fi prezent în mod evident pe majoritatea computerelor vizitatorilor site-ului dvs. - Courier sau Arial, de exemplu).

Adăugați toate caracterele speciale de care aveți nevoie din lista care se deschide în documentul dvs. Word și salvați acest document Word ca pagină web (selectat din lista derulantă „.html” la salvare). Ei bine, atunci tot ce trebuie să faceți este să deschideți această pagină web în orice editor HTML (același Notepad++ va face) și veți vedea toate codurile digitale ale mnemotecilor de care aveți nevoie:

Metoda este puțin complicată, dar dacă doriți să utilizați un caracter special rar pe pagina site-ului dvs., atunci va fi mai ușor decât să căutați pe Internet tabele precum cel arătat mai sus. Va trebui să lipiți codul de caracter special rezultat în locul potrivit și, în loc de acesta, pe pagina web, browserul va afișa caracterul de care aveți nevoie (de exemplu, un spațiu neîntrerupt).

Spațiu care nu se rupe și cratima moale în exemple

După cum am menționat deja mai sus și după cum puteți vedea din tabelul de caractere speciale dat chiar mai sus, unele mnemonice în Html au primit, pe lângă digital, și o desemnare simbolică pentru o memorare mai ușoară. Acestea. În locul semnului hash „#” (hash), cuvintele sunt folosite în variante simbolice. De exemplu, același spațiu neîntrerupt poate fi scris fie ca (mnemonic digital), fie ca (caracter).

Când scrieți articole, dacă trebuie să introduceți un ampersand (&) sau un parantez unghiular deschis (<), то для этого обязательно нужно использовать спецсимволы. Дело в том, что эти знаки в Html означают начало тега и браузер будет рассматривать их именно с этой точки зрения и отображать в тексте не будет.

Adică, dacă scrieți un articol în care va trebui să inserați, de exemplu, un afișaj de etichetă în text< body>sau trebuie doar să inserați un semn mai puțin decât (<), то сделав это без использования подстановок на веб странице вы ничего не увидите, т.к. браузер, обнаружив «<» , поймет, что это Html тег, а не текст статьи.

Prin urmare, va trebui să introduceți următoarea construcție pentru a rezolva o problemă similară:

Același lucru este valabil și pentru afișarea codului mnemonicului în sine, deoarece acestea încep cu un ampersand. Va trebui să inserați codul în text, înlocuind semnul și cu înlocuirea acestuia (caracter special):

Acest lucru va trebui făcut pentru a ajunge pe pagină<, а не отображение левой угловой скобки (<), в которую преобразует браузер мнемонику <, обнаружив при разборе знак амперсанда. Хитро, но вы все поймете попробовав это на практике.

Cel mai probabil veți folosi, de asemenea, un spațiu care nu se întrerupe, care va arăta ca un spațiu obișnuit pe o pagină web, dar browserul nu îl va trata deloc ca un caracter de spațiu și nu va efectua transferuri pe acesta(de exemplu, acest lucru va fi potrivit pentru expresii precum 1400 GB etc., pe care nu ar fi recomandabil să le împărțiți cu silabe în linii diferite):

1400 GB.

Uneori poate apărea situația inversă, când textul conține cuvinte foarte lungi și doriți să vă asigurați că, dacă este necesar, browserul Aș putea sparge aceste cuvinte cu silabe. În astfel de scopuri, este furnizat un simbol special „transfer soft” -

Cuvânt lung, lung;

Când devine necesar să treceți la o altă linie, browserul va folosi o cratimă în loc de mnemonicul cu cratima moale și va trimite restul cuvântului la linia următoare. Dacă există suficient spațiu pentru a plasa întreg acest cuvânt pe o singură linie, atunci browserul nu va desena nici un flux de linie. Este atat de simplu.

Multă baftă! Ne vedem curând pe paginile site-ului blogului

Puteți viziona mai multe videoclipuri accesând

S-ar putea să fiți interesat

MailTo - ce este și cum se creează un link în Html pentru a trimite un e-mail
Etichete și atribute ale titlurilor H1-H6, linie orizontală Hr, întrerupere de linie Br și paragraful P conform standardului Html 4.01
Cum să inserați un link și o imagine (foto) în etichetele HTML - IMG și A

Bună ziua, dragi cititori ai blogului! Cei care s-au familiarizat cel puțin superficial cu ea probabil că au luat deja notă, deși în termeni generali. Aceasta înseamnă că au o idee despre ce simboluri HTML sunt utilizate în general în codul documentului.

În articolul de astăzi vom încerca să ne dăm seama ce este un spațiu în HTML și în ce cazuri puteți folosi caractere de spații albe atunci când formatați codul în sine pentru o citire ușoară. Vom afla când este necesar să folosim un spațiu care nu se întrerupe și, de asemenea, vom face cunoștință cu alte personaje speciale (sau, așa cum sunt numite și mnemonice).

De fapt, v-aș sfătui să nu ignorați subiectul utilizării diferitelor caractere speciale, deoarece aceasta este o componentă importantă care vă permite să finalizați studiul limbajului de marcare hipertext. În general, informațiile furnizate în această publicație cu siguranță nu vor fi de prisos. Ei bine, acum la obiect.

Spații și caractere albe în HTML

În primul rând, este o notă importantă de făcut. Există taste speciale pe tastatura computerului care vă permit să separați text (mai multe despre asta mai jos). Cu toate acestea, doar o bară de spațiu largă oferă separare între cuvinte nu numai în editor, ci și în fereastra browserului. Există nuanțe la ruperea liniilor și la indentarea de la margini.

După cum știți, afișarea anumitor elemente într-un browser web este determinată de etichete. Pentru a formata textul, este folosit bine-cunoscutul , care este bazat pe blocuri. Adică, conținutul său este situat pe toată lățimea disponibilă.

La înfășurați liniile din paragraful P, trebuie să utilizați o singură etichetă BR, cu care puteți face acest lucru. Să presupunem că trebuie să inserăm în text câteva rânduri dintr-o poezie pe care o scriem într-un editor de text:

În ciuda faptului că rândurile versetului sunt localizate corect și cratimele sunt făcute în locurile potrivite, totul va arăta diferit în browser:

Pentru a obține aceeași afișare într-o fereastră de browser web, trebuie să scrieți BR la fiecare întrerupere de linie:

Acum am îndeplinit sarcina și liniile poetice vor fi afișate complet corect în browser:

Astfel, pauzele de linie necesare sunt finalizate. O altă caracteristică care trebuie remarcată aici este că mai multe spații care vin unul după altul sunt afișate de browserul web ca unul singur. Puteți verifica acest lucru dacă în același editor încercați să puneți nu unul, ci mai multe spații între două cuvinte și, făcând clic pe butonul „Salvare”, priviți rezultatul în browser.

Spațiu, tab și ruptură de linie

Practic, cu astea caractere cu spații albe Ne cunoaștem imediat ce începem să lucrăm cu textul în editor și îl formatăm în forma necesară. Pentru a implementa o astfel de sarcină, există chei speciale, fiecare dintre ele corespunde caracterului său spațial:

• Bara de spațiu este cea mai largă tastă de pe tastatura unui computer (fără inscripție);
• Tab - o tastă în stânga cu inscripția „Tab” și două săgeți îndreptate în direcții diferite;
• Rupere de linie - tasta „Enter”.

Totuși, așa cum am spus mai sus, obținem rezultatul final dorit nu numai într-un editor de text, ci și într-un browser, doar atunci când folosim prima cheie. Toate cele trei taste (inclusiv tab și ruptură de linie sunt utile la formatarea codului HTML. Să presupunem că așa arată un fragment de cod în NotePad++ (există o mulțime de informații despre acest editor) când se afișează toate caracterele spațiilor albe:

Obținem cod ușor de citit și de înțeles datorită spațiilor. Săgețile portocalii indică indentări create folosind tasta Tab, iar simbolurile CR și LF indică rupturi de linie create cu tasta Enter.

Containerele imbricate unul în celălalt sunt vizualizate, iar etichetele de deschidere și de închidere sunt clar vizibile. În această formă, acest cod poate fi editat cu ușurință. Acum compară-l cu același cod, care nu are o astfel de divizare a textului:

În același mod, folosind caractere cu spații albe, puteți scrie reguli CSS care vor arăta vizual clare și digerabile:

După ce aduceți toate stilurile la un numitor comun și finalizați complet editarea fișierului de stiluri, puteți efectua editarea eliminând toate spațiile din cod. Acest lucru este necesar pentru a crește, ceea ce este foarte important atunci când promovați o resursă.

Caractere speciale (sau mnemonice) în codul HTML

Acum să ne uităm la cazurile în care este necesar să folosim caracterele speciale pe care le-am menționat la începutul articolului. Caracterele speciale HTML, uneori numite mnemonice, au fost introduse pentru a rezolva o problemă de lungă durată cu codificările apărute în limbajul de marcare hipertext.

Când introduceți text pe tastatură, caracterele limbii pe care o utilizați sunt codificate. În browserul web, textul tastat va fi afișat folosind fonturile pe care le-ați selectat ca urmare a operației de decodare inversă.

Faptul este că există multe astfel de codificări, acum nu avem scopul de a le analiza în detaliu. Doar că fiecăruia dintre ele poate lipsi anumite simboluri, care, totuși, trebuie afișate. Să presupunem că simți nevoia de a scrie ghilimele simple sau un semn de accent, dar aceste pictograme pur și simplu nu sunt incluse în set.

Pentru a elimina această problemă, a fost introdus un sistem de simboluri speciale, care include un număr mare de mnemonice diferite. Toate încep cu un „&” și de obicei se termină cu un punct și virgulă „;”. La început, fiecare personaj special avea propriul său cod digital. De exemplu, pentru un spațiu care nu se rupe, pe care îl vom analiza mai detaliat mai jos, va fi valabilă următoarea intrare:

Dar după ceva timp, celor mai comune simboluri li s-au atribuit analogi de litere (mnemonice) pentru a le face mai ușor de reținut. Să presupunem că pentru același spațiu care nu se rupe arată așa:

Ca rezultat, browserul afișează simbolul corespunzător. Lista mnemotecilor este foarte voluminoasă, caracterele speciale utilizate cel mai frecvent în HTML puteti descoperi din tabelul de mai jos:

Cazuri de utilizare a unor caractere speciale, inclusiv spațiu care nu se întrerupe și cratima moale

Dacă ați studiat deja puțin tabelul, ați primit confirmarea a ceea ce am spus mai sus, că pentru a afișa toate caracterele speciale, se folosește un cod digital () sau analogul său alfabetic (mnemonice simbolică), unde în loc de un set de hash se scriu semne și cifre, litere ().

Acum să vedem când să folosim aceste coduri. Să presupunem că într-un articol trebuie să indicați o etichetă HTML în scop informativ, de exemplu,