Buna ziua! Să continuăm să ne uităm la elementele de bază ale programării site-urilor web. Este greu de imaginat cel puțin unul dintre ele care nu conține o etichetă de paragraf în codul său. Astăzi vom vedea cum să-l scriem corect și o descriere a mai multor acțiuni suplimentare cu text.

Exemplu

Să ne uităm la un exemplu despre cum să faci un paragraf în cod HTML.

Una sau mai multe propoziții.

O condiție prealabilă este prezența unei etichete de deschidere și de închidere. Apropo, puteți face totul direct în Notepad, trebuie doar să salvați fișierul în formatul corespunzător mai târziu.

Formatare

Destul de des observ că oamenii sunt interesați de cum să facă o linie roșie. Pentru un anumit paragraf se face foarte simplu.

Activarea acestor opțiuni va indenta prima linie la 15 pixeli de la marginea din stânga. Dacă astfel de modificări ar trebui aplicate tuturor etichetelor P, atunci în fișierul CSS care este conectat la paginile site-ului, puteți scrie codul prezentat mai jos.

Personal, de obicei nu fac linii roșii atunci când editez codul în Notepad sau alt editor.

Pur și simplu includ umplutură între blocurile de text. Pentru a face acest lucru, trebuie să specificați parametri speciali în CSS.

p(marja-jos:25px;)

Dacă utilizați acest design, atunci după fiecare paragraf va exista o indentare de 25 de pixeli.

De fapt, există o mulțime de opțiuni pentru a lucra cu HTML și diferite stiluri. Am descris doar câteva dintre ele, este foarte dificil să acopere totul într-un articol.

Vrei să afli mai multe? Puteți găsi utile publicațiile mele anterioare despre următoarele subiecte:

Aici voi încheia articolul și, cred, acum nu va fi dificil să faci paragrafe în HTML și să le format frumos folosind etichete speciale.

Vă doresc mult succes în stăpânirea programării. Apropo, te-ai gândit să faci bani pe site-uri de informare non-profit? El a oferit informații pur și simplu uimitoare special pentru cititorii săi.

Munca normală online și finanțele sunt subiectele cheie ale acestui blog. Puteți face cunoștință cu clienții potențiali online chiar acum din materialele publicate. Continui să pregătesc și să public conținut nou și, cel mai important, cu adevărat util. Abonați-vă la actualizările Workip pe adresa dvs. de e-mail. Ne vedem mai târziu.

Tipuri fundamentale C/C++ precum int , double etc. Este atomic, de exemplu, sigur pentru fire?

sunt liberi de curse de date; adică dacă un thread scrie la un obiect de acest tip și un alt thread citește din el, comportamentul este bine definit?

Dacă nu, depinde de compilator sau de altceva?

Peter Mortensen

4 raspunsuri:

puteți folosi în schimb std::atomic sau std::atomic .

Nota: std::atomic a fost introdus cu C++11 și înțeleg că înainte de C++11, standardul C++ nu recunoștea deloc existența multithreading-ului.

executarea programului 5.1.2.3

Atunci când procesarea abstractă a mașinii este întreruptă de un semnal, nu sunt specificate valorile obiectelor care nu sunt obiecte atomice neblocante, nici de tip volatil sig_atomic_t, nici starea mediului în virgulă mobilă. Această valoare a oricărui obiect modificat de un handler care nu este nici un obiect atomic fără blocare, nici de tip volatil sig_atomic_t devine nedefinită atunci când handler-ul iese, la fel ca starea mediului în virgulă mobilă dacă este astfel modificat de către handler și este nu a fost readus la starea inițială.

5.1.2.4 Execuții cu mai multe fire și curse de date

două evaluări de expresie conflict dacă unul dintre ele modifică o regiune de memorie iar celălalt citește sau modifică aceeași regiune de memorie.

[mai multe pagini de standarde - unele paragrafe legate explicit de tipurile atomice]

execuția programului conține curse de date dacă conține două activități conflictuale pe fire diferite, dintre care cel puțin una nu este atomică și nici una nu are loc înaintea celeilalte. care sunt rezultatele cursei de date în comportament nedefinit.

procesorul poate, de asemenea, să reordoneze accesările la memorie în conformitate cu constrângerile de ordonare a memoriei acelui procesor. Restricțiile privind comandarea memoriei pentru arhitectura x86 pot fi găsite în Ghidul dezvoltatorului de software pentru arhitecturi Intel 64 și ia32, secțiunea 8.2, începând de la pagina 2212.

tipurile primitive (int, char etc) nu sunt atomice

Sper că asta se explică De ce tipurile primitive nu sunt atomice.

Informații suplimentare pe care nu le-am văzut menționate în alte răspunsuri până acum:

dacă utilizați std::atomic , de exemplu, bool este de fapt atomic pe arhitectura țintă, atunci compilatorul nu va genera garduri sau încuietori redundante. Va fi generat același cod ca și pentru un simplu bool.

cu alte cuvinte, utilizarea std::atomic face ca codul să fie mai puțin eficient dacă este de fapt necesar pentru corectitudine pe platformă. Deci nu există niciun motiv să o evităm.

Am fost parțial prezentate titlul paginii H1 și paragraful P în prima lecție despre structura unui document HTML. Acum să ne uităm la etichetele de markup logice: titluri, paragrafe, liste, elemente vizibile ale elementului Body și etichete de formatare fizică mai detaliat. Pentru a face acest lucru, să schimbăm ușor pagina noastră exemplu sau să o tastam din nou:

În pagina noastră html de antrenament am adăugat (marcat cu săgeți, o dată): un titlu de nivel 2 - o etichetă H2, două titluri de nivel 3 - o etichetă H3, un alt paragraf - o etichetă P, o listă cu marcatori - Ul și mai multe etichete de formatare fizică . Să deschidem pagina în browser:

Etichetele H1-H3 indică titluri de diferite niveluri - există șase dintre ele. În consecință, titlul celui mai de jos nivel este H6. Titlurile trebuie folosite logic, iar titlul H1 de nivel superior ar trebui să apară o singură dată pe pagină. Titlul H1 este afișat cu font mare de către browsere, iar dimensiunea fontului din titlurile nivelurilor următoare este redusă corespunzător.

Boții de căutare acordă o importanță deosebită conținutului titlurilor de nivel superior. Și este mai ușor pentru utilizatori să navigheze pe o pagină cu titluri construite logic corect.

Etichete de formatare fizică

Există o bară orizontală vizibilă pe pagină după al doilea paragraf - este creată de elementul Hr, care nu are o etichetă de închidere. Eticheta Br înseamnă o linie nouă, de asemenea, nu este împerecheată - fără o etichetă de închidere. Când formatați textul, puteți utiliza mai multe elemente Br la rând - fiecare următor va adăuga o nouă linie goală.

Acum să acordăm atenție cuvântului „corp” din al doilea paragraf, inclus într-o etichetă B pereche, care face cuvântul îndrăzneț. Și expresia „format text” este afișată cu caractere cursive - acest lucru se realizează folosind eticheta I Eticheta U setează sublinierea (nu este în exemplul nostru).

Pe lângă aceste etichete care evidențiază fragmente de text, există și o etichetă Strong în HTML - evidențiază un fragment care este important ca semnificație (bold). Și eticheta Em este puțin mai puțin importantă (cursive). Boții de căutare acordă o atenție mai mare acestor două etichete, care indică expresii care sunt importante în sensul lor logic. Este recomandabil să includeți cuvinte cheie în ele, dar nu trebuie să exagerați. Același lucru este valabil și pentru titluri.

Iată câteva etichete fizice de formatare a textului: Q - Evidențiază un citat într-o linie. Element de bloc Blockquote - această etichetă poate conține mai multe paragrafe.

Eticheta de cod este folosită pentru a marca fragmentele de cod, trebuie utilizată cu rupturi de linie Br și spații neîntrerupte: sunt folosite simboluri speciale pentru a le desemna. simbol (primul caracter - ampersand: tasta 7 cu Shift apăsată în aspectul englez). Dar eticheta Pre afișează codul programului așa cum este, cu spații și atâtea rânduri câte sunt în cod.

Acestea sunt cele mai frecvent utilizate elemente de design text pentru alte etichete de formatare și caractere speciale, consultați Referința HTML, aflată pe același site - are o navigare alfabetică convenabilă.

Crearea listelor html

Rămâne să luăm în considerare crearea de liste, o avem marcată și specificată de eticheta asociată Ul, iar elementele, sau elementele sale, de eticheta Li (prima captură de ecran). Folosind atributul type, atât pentru etichetele Ul cât și pentru Li, putem schimba tipul de marker. Implicit, i.e. dacă atributul nu este specificat, valoarea acestuia este „disc” - un cerc. Puteți seta atributul tip cu valoarea „cerc” - cerc. Sau cam asa:

- vom obține o listă cu marcatori pătrați.

De fapt, nu mă voi concentra pe alte atribute ale etichetei decât cele obligatorii și câteva exemple pentru înțelegere generală. Pentru a seta stiluri, este mai bine să folosiți proprietăți CSS - vom ajunge la ele și veți găsi atributele în cartea de referință.

Pe lângă cele marcate, există liste numerotate, care sunt specificate cu eticheta Ol, și elemente de listă, precum cele marcate, cu eticheta Li. În plus, pentru ambele tipuri de liste puteți crea liste imbricate. Să complicăm sarcina și să ne schimbăm lista din pagina exemplu în următoarele:



Să deschidem pagina în browser și putem vedea clar: o listă numerotată cu o listă cu marcatori imbricată în ea, pentru care valoarea „pătrat” a atributului tip specifică marcatori pătrați.

Bună ziua, dragi cititori ai blogului! Acest articol va vorbi despre etichete de formatare a textului. Exemplele principale includ crearea textului cu caractere aldine sau cursive. De asemenea, vom analiza impactul unor etichete asupra optimizării interne a site-ului web și regulile de scriere a acestora. Puteți citi despre asta în articolul dat. Apropo, puteți găsi elemente de design text similare în multe editoare de text, de exemplu în Word.

Etichetele sunt împărțite în 2 tipuri: bloc și inline. Când utilizați primul, puteți modifica conținutul unei părți din text (linii, fragmente individuale sau cuvinte), iar cele din urmă sunt . Etichetele de formatare pe care le vom analiza în acest articol sunt în principal litere mici.

Reguli și ordinea scrierii etichetelor

Știți deja ce sunt etichetele de deschidere și de închidere. Dacă nu, atunci citiți articolul dat chiar la începutul acestui material. Pe scurt, există două tipuri de etichete: simple (de exemplu, linie nouă
) și container (în perechi). Deci, toate etichetele de formatare a textului sunt pereche. Aceasta înseamnă că orice element are o etichetă de deschidere și de închidere, iar evidențierea trebuie plasată între ele. De exemplu, selectarea corectă a unei fraze ar arăta astfel: Fragment selectat

Când browserul procesează acest fragment, veți vedea următorul text: Fragment selectat. Apropo, toate etichetele nu sunt afișate în fluxul RSS ().

Principalul lucru atunci când scrieți etichete este să vă amintiți să le închideți. În caz contrar, tot textul de pe pagină va fi evidențiat cu caractere aldine (în exemplul cu eticheta ). Dar există cazuri când trebuie să evidențiați un anumit fragment atât în ​​aldine, cât și în cursive în același timp. Dar nu există nicio etichetă care să efectueze această acțiune. Există o singură cale de ieșire din această situație: folosiți două etichete în același timp. Nu contează în ce ordine le folosiți. Prin urmare, scrieți text cu etichete ca aceasta:

Fragment selectat

sau cam asa:

Fragment selectat

Veți primi în continuare Fragment selectat cursiv și îndrăzneț în același timp. Cu toate acestea, este de preferat să folosiți prima variantă, deoarece inițial a fost singura și corectă. De asemenea, nu uitați că fiecare browser poate procesa etichetele în mod diferit (), în funcție de setări. Acum să trecem la etichetele de formatare în sine.

Text îngroșat și italic - etichete , , Şi

Cele mai populare etichete de formatare a textului - evidențierea acestuia îndrăzneţŞi cursive. Ele sunt de obicei folosite pentru a da importanță unui fragment. Primul caz servește la evidențierea unui fragment care conține informații utile sau cuvinte cheie. Cursivele servesc aceluiași scop ca și textul aldin, dar informațiile sunt mai puțin importante, deoarece caracterele cursive sunt mai puțin vizibile pe fundalul textului corpului decât textul aldin.

Să luăm în considerare mai întâi făcând textul aldine. Există două etichete utilizate pentru această acțiune − Şi . Nu există nicio diferență de aspect. Deși, având în vedere că fiecare browser poate interpreta fiecare element în mod diferit, este posibil să observați diferențe. Așa arată textul din etichete Şi într-o formă deja procesată de browser:

Text în etichete puternic

Text în etichete b

Și iată cum arată aceste două rânduri în codul sursă al paginii:

Text în etichete puternic Text în etichete b

Aceeași situație o putem observa și în cazul etichete italice Şi . Încercați să găsiți diferențele dintre cele două exemple:

Text în etichetele em

Text în etichetele I

Și aici este codul sursă:

Text în etichetele em Text în etichetele I

Deci, etichetele considerate aldine și italice nu sunt de fapt diferite, dar atunci de ce avem nevoie, de exemplu, de eticheta dacă există ? La urma urmei, acesta din urmă conține un singur caracter (fără a număra paranteze) și, prin urmare, este mai ușor de scris. Și ideea este că etichetele Şi influenta . Dacă înconjurați cuvintele cheie cu aceste etichete, acest lucru va avea un efect benefic asupra promovării site-ului Principalul lucru este să nu exagerați - textul trebuie să conțină maximum 5% text aldine în etichetă , și aceeași cantitate de cursive în etichetă .

Dacă doriți doar să evidențiați un punct din text, atunci utilizați eticheta sau . În general, cred că motoarele de căutare consideră și textul din aceste etichete ca fiind mai important, dar optimizare internă au încă o influenţă mai mică decât Şi .

Etichete pentru evidențierea textului cu o linie - , Şi

Acum să ne uităm la câteva etichete care folosesc o liniuță în designul textului. Cel mai faimos editor de text pe care îl cunoști este etichetă sau subliniere. Această etichetă nu are impact asupra clasamentului (din câte știu eu), dar evidențierea unui text și concentrarea atenției asupra acestuia va ajuta. Am dat un exemplu de utilizare a acestei etichete chiar mai sus.

Încă două etichete similare ca scop - Şi . Ambele îndeplinesc funcția de a șterge textul. Puteți folosi această etichetă în orice situație: dacă actualizați un document (sau mai bine zis, o parte din acesta), îl puteți tăia pe cel vechi și adăugați unul nou; dacă aveți de gând să scrieți ceva care se abate de la subiectul materialului; ceva care nu corespunde standardelor morale și etice.

Diferențele dintre aceste două etichete sunt doar în lor scris, drept urmare este de preferat să se folosească primul, deoarece în primul rând, este mai convenabil să scrii și, în al doilea rând, pagina ta va conține mai puțin cod HTML, iar motoarele de căutare le place acest lucru.

Etichetă și atribute - parametrii fontului textului

Acum luați în considerare o etichetă care nu este folosită fără atribute. Folosind-o, puteți seta parametrii pentru o anumită bucată de text. În general, acum este de preferat să se utilizeze (foile de stil în cascadă), deoarece... folosindu-le puteți reduce foarte mult întregul cod HTML al paginii. Deci, să ne uităm la aceeași etichetă . Totul există pentru el trei atribute:

• faţă- fontul în sine. De exemplu, Arial, Courier sau Verdana. Puteți enumera mai multe, pentru că nu toți utilizatorii au un set extins de fonturi, iar prin scrierea mai multor în atributul face, browserul va putea alege pe care să îl folosească sau, mai degrabă, care este prezent în sistem;
• dimensiune— un atribut care indică dimensiunea textului. Poate fi exprimat atât în ​​unități convenționale, cât și în pixeli;
• culoare- culoarea textului. Acest atribut poate fi folosit atât în ​​codurile de culoare HTML, cât și în cele word. Primele au forma #FFFFFF (unde F este orice număr sau literă de la A la F), iar cele doua sunt scrise cu cuvinte simple (de exemplu, roșu).

Așa arată textul din etichetă folosind fiecare atribut:

Acest text are 6 pixeli

Acest text este roșu
Acest text este în font Arial
Acest text este roșu și are dimensiunea de 5 pixeli

Și iată ce veți vedea după procesarea codului scris:


Elemente de proiectare a textului bloc - titluri

-

, paragraful

În cele din urmă, ne vom uita la elementele bloc, care sunt utilizate în aproape fiecare document. Acestea sunt etichete de titlu și paragraf. Să luăm în considerare primul. Există 6 tipuri de titluri și fiecare are propria etichetă. Fiecare tip are doar propriul său număr de serie și este înregistrat folosind etichete

,

,...,

. Iată cum arată toate anteturile atunci când sunt procesate:



Numărul de după titlul cuvântului corespunde numărului din etichetă . Titlurile au un impact uriaș asupra optimizării paginii, așa că includeți-le în etichete cuvinte cheie. Există destul de multe caracteristici ale acestui caz, despre care voi vorbi în articolele următoare.

Acum să vorbim despre eticheta de evidențiere a paragrafului

Funcția acestei etichete este de a separa textul dintre un alt text identic și o linie goală. Dacă te uiți la codul sursă al unui document, poți vedea următoarele:



Dreptunghiurile verzi conțin un paragraf, dreptunghiurile roșii conțin altul. Și iată cum arată acest cod după procesarea de către browser (săgeata indică o linie goală):



Drept urmare, obținem o separare destul de vizibilă a unui paragraf de altul, ceea ce este benefic - citirea devine mai convenabilă.

Acesta este sfârșitul articolului despre etichete de formatare a documentelor. Sunt mult mai multe decât am descris în acest material. Doar că trebuie spus multe despre unele dintre ele, drept urmare articole separate cu o recenzie completă le vor fi dedicate!

Orice text are propria sa structură unică: cărțile sunt împărțite în părți, secțiuni și capitole, ziarele și revistele au titluri și subtitluri separate, care, la rândul lor, includ fragmente de text care au și o structură proprie: paragrafe, indentări etc.

Textul postat pe paginile web nu face excepție, de asemenea, trebuie să aibă o structură logică pe înțelesul fiecărui utilizator. La urma urmei, multe depind de cât de convenabil și simplu este perceput textul de pe pagină: în primul rând, ce impresie va avea vizitatorul despre site-ul tău.

Pentru a crea unități structurale de text, cum ar fi paragrafele, documentele HTML folosesc eticheta

, care separă fragmentele de text cu o indentare verticală (se adaugă o linie goală înainte și după paragraf).

Notă: în mod implicit, distanța dintre paragrafe este 1em (em este o unitate de măsură egală cu înălțimea fontului), adică distanța dintre paragrafe depinde direct de dimensiunea fontului.

Pentru a modifica marginile dintre paragrafe fără a modifica dimensiunea fontului, puteți utiliza proprietatea margin CSS.

Nu uitați de eticheta de închidere

Majoritatea browserelor vor reda corect documentul HTML chiar dacă uitați eticheta de închidere.

Paragraf

Un alt paragraf

Acest cod va funcționa în majoritatea browserelor, dar nu vă bazați pe el. O etichetă de închidere uitată poate duce la rezultate sau erori neașteptate.

Linie roșie

Ce este o linie roșie? Prin definiție, aceasta este linia de început a unui paragraf, care obișnuia să fie evidențiat cu roșu (de unde și numele). Înainte de inventarea tiparului, cărțile erau scrise de mână - un capitol sau o parte din text, primul cuvânt sau literă era scris cu vopsea roșie. Așa a apărut conceptul de „scriere de pe linia roșie” - aceasta înseamnă începutul unui nou gând, capitol sau parte.

Cu toate acestea, atunci când se creează pagini web, designul liniei roșii este folosit destul de rar, în ciuda faptului că face mult mai convenabilă perceperea vizuală a textului, ceea ce este destul de important pentru cititorul tradițional - nu toată lumea este confortabilă să citească versiunea electronică a textul.

Pentru a adăuga o linie roșie la paragrafele dvs., trebuie să utilizați proprietatea CSS text-indent, care vă permite să indentați prima propoziție:



Încercați »

În exemplul de mai sus, primul rând al fiecărui paragraf de pe pagină va începe cu o indentare de 25 de pixeli. Exemplul de mai jos demonstrează cum puteți seta o linie roșie numai pentru un anumit paragraf dintr-o pagină.

Ca în orice artă adevărată, nu există fleacuri în textele bune, la care unii includ linia roșie, crezând că utilizarea sa nu este atât de importantă.

Încercați »

Cu toate acestea, trebuie să înțelegem că orice virgulă poartă atât o sarcină estetică, cât și semantică și nu este doar un tribut adus regulilor gramaticale - acest lucru se aplică și formatării.