Astăzi vă voi spune cum să faceți cuvinte cu fonturi aldine pe site folosind HTML și CSS. Acest design este utilizat atunci când aveți nevoie pentru a evidenția anumite informații de pe pagină. Mai mult, nu numai despre titluri, ci și despre cuvinte simple, fraze în text. Este pur și simplu implementat suficient.
Etichetele HTML speciale sunt folosite pentru a evidenția un anumit text. și . De exemplu, următorul cod:
| Text normal. Thumbnail.. Îndrăzneț puternic. |
Text normal.
Thumbnail..
Îndrăzneț puternic.
La ieșire oferă o astfel de imagine:
Ultimele două opțiuni arată vizual la fel, dar ele diferă ușor unul cu celălalt. Etichetă Specifică imaginea stilistică simplă a cuvântului cu font îndrăzneț, în timp ce Aceasta adaugă o valoare semantică "îmbunătățită" (importantă) (importantă). Adică, ultima linie nu este doar un text îndrăzneț, ci câteva informații importante. În principiu, pentru motoarele de căutare recomandă utilizarea acesteia .
De asemenea, puteți îndeplini fontul de grăsime prescris în HTML cu stiluri:
Un exemplu de text îndrăzneț.
Text de probă S. gras Pe scurt.
Pe site-ul este afișat astfel:
În ciuda faptului că codul textului îndrăzneț pentru HTML funcționează corect, nu faceți acest lucru. Toate stilurile de design trebuie făcute în fișierul CSS. Prin urmare, în exemplul de mai sus ar fi trebuit să fi fost pentru etichete
ȘI Specificați clasa corespunzătoare și apoi înregistrați designul în foaia de stil. Acestea sunt regulile pentru înregistrarea codului. Prin urmare, pentru un font îndrăzneț în HTML, utilizați o etichetă .
Textul îndrăzneț pe css
Pentru a face un font ferm în CSS, este utilizată proprietatea de greutate a fontului. Cu aceasta, este indicată "saturația" fragmentului de text. Valorile pot fi de la 100 la 900, dar cele mai frecvent utilizate este:
- bold (grăsime) - 700 în mod implicit;
- normal (normal) - 400 Implicit.
Există, de asemenea, opțiuni pentru valorile mai îndrăznețe și mai ușoare care modifică fontul în funcție de părinte la mai mult sau mai puțin grăsimi, respectiv.
Pentru a seta textul îndrăzneț în CSS, aveți nevoie de un alt stil, de exemplu, de exemplu:
Textul normal S. selecție de grăsime in centru.
puternic (greutate font: îndrăzneț;)
Aici am vrut să sărbătoresc o mică nuanță, pe care mi sa spus - dacă creați o nouă clasă pentru un element, este de dorit să utilizați un nume mai mult sau mai puțin "Nume de înțeles". De exemplu, în exemplul de deasupra stilului de stil \u003d "my-bold-font" arată mai logic decât clasa \u003d "nou-font", pentru că Puteți înțelege parțial scopul său. Acesta este un plus pentru cei care vor arăta și vor folosi aspectul dvs. în viitor.
În articolul următor, vă voi spune despre fonturi de grăsimi interesante pe care am reușit să o găsesc.
În dimensiunea fontului HTML joacă un rol important. Vă permite să atrageți atenția utilizatorului la informații importante plasate pe pagina site-ului. Deși nu numai mărimea literelor este importantă, dar și culoarea, grosimea și chiar o familie.
Etichete și atribute cu robot cu fonturi HTML
Limba hipertextului are un mare set de fonduri pentru a lucra cu fonturile. La urma urmei, formatarea textului este principala sarcină a HTML.
Motivul pentru crearea limbajului HTML a devenit problema afișării browserelor de formare a textului.
Luați în considerare etichetele care sunt utilizate pentru a lucra cu fonturile în HTML și atributele acestora. Principalul este eticheta . Folosind valorile atributelor sale, puteți seta mai multe caracteristici ale fontului:
- culoare - Setează culoarea textului;
- dimensiune - Dimensiunea fontului în unități condiționate.
Valoarea atributului pozitiv este acceptată de la 1 la 7.
- face - folosit pentru a instala familiile de fonturi text care urmează să fie utilizate în interiorul etichetei . Câteva valori enumerate prin virgulă sunt acceptate imediat.
Numai textul care se află între partea din eticheta perechii de fonturi este formatată. Textul rămas este afișat prin font standard instalat în mod implicit.
De asemenea, în HTML există o serie de etichete de perechi care specifică o singură regulă de formatare. Acestea includ:
- - Specifică fontul îndrăzneț la HTML. Etichetă prin acțiuni similare cu cea precedentă;
- - dimensiunea este mai mare decât setul implicit;
- - dimensiunea fontului mai mic;
- - Text înclinat (italic). O etichetă similară ;
- - Text cu subliniere;
- accentuat;- - afișați textul numai în litere mici;
- - în majuscule.
Text normal
Thumbnail.
Thumbnail.
Mai obișnuit
Mai puțin obișnuit
Italică
Italică
Cu accent
Zdrobit
Caracteristicile atributului de stil
În plus față de etichetele descrise, există încă mai multe modalități de a schimba fontul în HTML. Unul dintre ele este utilizarea atributului universal de stil. Folosind valorile proprietăților sale, puteți seta stilul de afișare a fontului:
1) Font-Family - Proprietatea stabilește familia de fonturi. Puteți enumera mai multe valori.
Schimbarea fontului în HTML la următoarea valoare va apărea dacă familia anterioară nu este instalată în sistemul de operare al utilizatorului.
Sintaxă de scriere:
font-Family: Numele fontului [, numele fontului [, ...]]
2) Dimensiune font - Dimensiunea este setată de la 1 la 7. Aceasta este una dintre principalele modalități la modul în HTML puteți mări fontul.
Sintaxă de scriere:
dimensiune font: dimensiune absolută Dimensiune relativă Valoare | Interesul | moşteni.
Dimensiunea fontului poate fi de asemenea setată:
- În pixeli;
- În valoare absolută ( xx-mic, x-mic, mic, mediu, mare);
- În procente;
- Puncte (PT).
Font-dimensiune: 7
Dimensiune font: 24px
Dimensiune font: x-mare
Font-dimensiune: 200%
Font-dimensiune: 24pt
3) Stilul de font - stabilește stilul de scriere a fontului. Sintaxă:
font-stil: normal | Italice | Oblic | moşteni.
Valori:
- scrierea normală;
- italic - italic;
- oblic - font cu o panta spre dreapta;
- moșteniți - moștenește scrisul elementului părinte.
Un exemplu de modificare a fontului în HTML utilizând această proprietate:
font-stil: moștenire
font-stil: italic
font-stil: normal
font-stil: oblic
4) Varianta font - traduce toate literele majuscule la titlu. Sintaxă:
font-varianta: normal | Capace mici | moşteni.
Un exemplu de modificare a fontului în HTML de această proprietate:
font-varianta: moștenire
font-varianta: normal
varianta de font: capace mici
5) Greutatea fontului - vă permite să setați grosimea scrisului textului (saturație). Sintaxă:
greutatea fonturilor: Bold | Bolder | mai ușoară | Normal | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
Valori:
- bold - instalează un font html îndrăzneț;
- mai îndrăzneț - gras față de normal;
- bricheta este saturată în raport cu normal;
- normal - scriere normală;
- 100-900 - Grosimea fontului este stabilită în echivalentul numeric.
greutate font: Bold
greutate font: Blower
font-greutate: mai ușoară
greutate font: normal
greutate font: 900
greutate font: 100
Proprietatea fonturilor și culoarea fontului HTML
Font este o altă proprietate de containere. În interiorul în sine, a combinat valorile mai multor proprietăți concepute pentru a schimba fonturile. Sintaxă font:
font: Fotografie de font de dimensiune font | moşteni.
De asemenea, fonturile utilizate de sistem în inscripții pe diverse controale pot fi specificate ca valoare.
- caption - pentru butoane;
- icon - pentru icoane;
- mENU - MENU;
- mesaj-box - casete de dialog;
- subtitrare mică - pentru controale mici;
- stare-bar - String de stare Font.
font: Icon.
font: Caption
font: meniu.
font: caseta de mesaje
subtitrare mică.
font: Stare-bar
font: italic 50px Bold "Times New Roman", ori, serif
Pentru a seta culoarea fontului în HTML, puteți utiliza proprietatea de culoare. Vă permite să setați culoarea, utilizând cuvântul cheie, cât și în format RGB. Precum și sub formă de cod hexazecimal.
Bună ziua, dragi cititori de blog! Acest articol va vorbi despre tag-uri de formatare a textului. Exemple luminoase sunt selectarea textului cu caractere aldine sau italice. De asemenea, luăm în considerare influența unor etichete asupra optimizării interne a site-ului și a regulilor de a le scrie. Despre atunci puteți citi în articolul de mai sus. Apropo, puteți întâlni elemente similare de proiectare a textului în mai mulți editori de text, de exemplu, în cuvânt.
Etichetele sunt împărțite în 2 tipuri: bloc și litere mici. Când utilizați primul, puteți schimba conținutul textului textului (linii, fragmente separate sau cuvinte), iar al doilea sunt. Formatarea etichetelor pe care le considerăm în acest articol sunt în principal mai mici decât.
Reguli și proceduri pentru scrierea etichetelor
Știți deja ce deschideți și închideți etichetele. Dacă nu, citiți articolul chiar de la începutul acestui material. Dacă scurt, atunci etichetele sunt două tipuri: Single (de exemplu, transferați la un șir nou) și recipientul (pereche). Deci, toate etichetele de formatare a textului sunt parn. Aceasta înseamnă că orice element are etichete de deschidere și închidere, iar fragmentul separat trebuie plasat între ele. De exemplu, selecția corectă a frazei va arăta astfel: Fragment dedicat
Când browserul procesează acest fragment, veți vedea acest text: Fragment dedicat.Apropo, în RSS Ribbon toate etichetele nu sunt afișate ().
Principalul lucru atunci când scrieți etichete - nu uitați să le închideți. În caz contrar, întregul text de pe pagină va fi evidențiat grăsimile (în exemplul cu eticheta ). Dar există astfel de cazuri atunci când trebuie să evidențiezi un anumit fragment și caractere aldine și italice în același timp. Dar eticheta care efectuează această acțiune nu există. Ieșiți această situație este una: utilizați două etichete în același timp. În ce ordine de utilizare nu are. Prin urmare, scrierea textului cu etichete astfel:
Fragment dedicat
sau astfel:
Fragment dedicat
Încă mai primești Fragment dedicat italic și grăsime în același timp. Cu toate acestea, este de preferat să se folosească prima opțiune deoarece a fost inițial singura și corectă. De asemenea, nu uitați că fiecare browser poate procesa etichete în moduri diferite (), în funcție de setări. Și acum ne întoarcem la etichetele în sine
Selectarea textului în gras și italic - etichete , , și
Cele mai populare etichete de formatare a textului îl subliniază. gras și cursiv. De obicei, acestea sunt folosite pentru a da importanța oricărui fragment. Primul caz este utilizat pentru a evidenția un fragment care conține informații utile sau cuvinte cheie. Italic se aplică în același scop ca textul gras, dar informațiile sunt mai puțin importante, deoarece implică în fundalul textului principal mai puțin vizibil decât textul grăsimilor.Luați în considerare pentru început selectarea textului uleios. Pentru această acțiune utilizează două etichete - și . Nu există nicio diferență în aparență. Deși, având în vedere faptul că orice browser poate interpreta fiecare element în felul său, puteți vedea orice diferențe. Iată cum arată textul în etichete și Într-un formular de browser deja procesat:
Text în etichete puternice
Text în etichete b
Dar care sunt cele două linii din pagina sursă a paginii, arată ca:
Text în etichete puternice Text în etichete b
Aceeași situație pe care o putem observa în cazul tagji de selecție italică și . Încercați să găsiți diferențe între două exemple:
Text în etichete em
Text în etichete i
Dar codul sursă:
Text în etichete em Text în etichete i
Deci, etichetele de descărcare discutate cu caractere aldine și itly nu diferă de fapt, dar atunci, de exemplu, noi, de exemplu, etichetă în cazul în care există ? La urma urmei, acesta din urmă conține doar un singur caracter (fără bazele de numărare) și, prin urmare, este mai ușor să scrieți. Și lucrul este că etichetele și Influenta asupra. Dacă veți înconjura aceste cuvinte cheie etichete, acesta va beneficia de promovarea site-ului. Nu ar trebui să exagerate - maximul în text ar trebui să fie de 5% din textul FATTE din etichetă , și același și cursiv în etichetă .
Dacă doriți să evidențiați pur și simplu orice moment în text, utilizați eticheta sau . În general, cred că motoarele de căutare consideră, de asemenea, textul din aceste etichete ca fiind mai importante, dar pe optimizare internăele au încă un impact mai mic decât și .
Etichete de selecție a textului - , și
Acum luați în considerare mai multe etichete care utilizează linia în proiectarea textului. Cele mai renumite pentru tine de la editori de text - etichetă
sau subliniere. Influența asupra clasificării Această etichetă nu (din câte știu), ci să aloce orice text și să se concentreze pe acesta va ajuta. Un exemplu de utilizare a acestei etichete am adus puțin mai mare. Două mai asemănătoare cu scopul etichetei - și . Ambele îndeplinesc funcția de overclocking de text. Puteți utiliza această etichetă în orice situație: dacă actualizați documentul (sau mai degrabă o parte din ea), puteți să traversați vechiul și să adăugați unul nou; Dacă veți scrie ceva care părăsește subiectul materialului; Ceva care nu corespunde standardelor morale și etice.
Diferențele acestor două etichete sunt doar în ei scris, ca rezultat, este de preferat să se folosească primul, deoarece În primul rând, este mai convenabil să scrieți și, în al doilea rând, pagina dvs. va fi mai mică decât codul HTML și motoarele de căutare ca acesta.
Etichetă și atribute - parametrii fontului textului
Luați în considerare acum eticheta care nu este utilizată fără atribute. Cu aceasta puteți specifica parametrii pentru un anumit fragment al textului. În general, acum este preferabil să utilizați (foi de stil cascadă), pentru că Cu ajutorul acestora, puteți reduce cu tărie întregul cod al paginii HTML. Deci, luați în considerare chiar eticheta . Pentru că există numai trei atribute:
- față. - Font-ul însuși. De exemplu, Arial, Courier sau Verdana. Puteți lista mai multe, pentru că Nu toți utilizatorii au un set extins de fonturi și scrieți câteva în atributul feței, browserul va putea alege care să utilizeze sau mai degrabă - care este prezent în sistem;
- mărimea - Atribut indicând dimensiunea textului. Acesta poate fi exprimat atât în \u200b\u200bunități convenționale, cât și în pixeli;
- culoare - culoarea textului. Acest atribut poate fi utilizat atât în \u200b\u200bcodurile HTML ale culorilor, cât și în verbal. Primul are o formă #FFFFFF (unde f este orice cifră sau scrisoare de la A la F), iar al doilea este scris cu cuvinte simple (de exemplu, roșu-roșu).
Așa că arată ca text în etichetă Utilizarea fiecărui atribut:
Acest text are o dimensiune de 6px
Acest text este roșu Acest text are un font arial Acest text de roșu și dimensiune 5pxDar ceea ce veți vedea, după procesarea codului scris: 
Blocați elementele de design text - titluri -, alin
, alin
În cele din urmă, vom analiza elemente bloc care sunt folosite în aproape fiecare document. Acestea sunt titlurile și paragraful etichetelor. Luați în considerare primul. Anteturile sunt 6 specii și fiecare are propria ta etichetă. Fiecare tip poartă numai numărul său de ordine și înregistrat cu etichete.
, ,..., . Iată cum arată anteturile în forma tratată:
. Iată cum arată anteturile în forma tratată:
DIGIT După ce antetul cuvântului corespunde numărului din etichetă
Și acum să vorbim despre etichetarea alocării paragrafului
Funcția acestei etichete este de a separa textul între celălalt text cu un șir gol. Dacă vă uitați la codul sursă al oricărui document, puteți vedea următoarele:
În dreptunghiuri verzi, un paragraf, în roșu - celălalt. Dar cum se întâmplă acest cod după procesarea unui browser (săgeata indică un șir gol):
Ca rezultat, obținem o separare destul de vizibilă a unui paragraf de la altul, care este bine-citirea devine mai convenabilă.
Care a ajuns la sfârșitul articolului despre formatarea documentelor. Ele sunt mult mai mult decât, mai degrabă decât am descris în acest material. Doar unii trebuie să spună destul de multe despre unii, ca rezultat, vor fi dedicați articolelor individuale cu o imagine de ansamblu completă.!
Fontul gras este determinat folosind atributul CSS grosimea fontuluicare pot lua următoarele valori:
- mai usoara. - Ușoară
- normal - Normal
- Îndrăzneţ. - gras
- mai îndrăzneț. - mai multa grasime
- 100..900 - 100 corespunde celui mai bun font; 900 - Tolstoy.
Atribut stilul fontului (desenul fontului) servește la scrierea acesteia în caractere italice și poate lua următoarele valori:
- cursiv - italic, marginile textului sunt rotunjite
- normal - Normal
- oblic. - italic
Atribut font-varianta. (Tipul de font) servește la scrierea cu majuscule majuscule și poate lua următoarele valori:
- normal - Normal
- sMAOO-CAPS. - Capitalul mic
Împreună cu o capitală grasă, italică și mică, există încă câteva tipuri populare de desen: subliniere și marcare.
Atribut text-decorare. (Decorarea textului) servește la sublinierea textului și poate lua următoarele valori:
- clipește. - Textul strălucitor (adică nu este acceptat)
- linia. - Text încrucișat
- nici unul - fără modificări
- overline - linia peste text
- subliniază - text subliniat
Atribut transformare text (Transformarea textului) servește la locul de muncă cu litere mici și pot lua următoarele valori:
- valorifica - toate cuvintele încep cu o scrisoare de capital
- litere mici - tot textul este scris de litere mici
- nici unul - fără modificări
- majuscule. - Tot textul este scris prin majuscule
Exemplu de utilizare grosimea fontului, stilul fontului, text-decorare., transformare text: Exemplu numărul 9.
Codul paginii HTML:
Untitled.
"Inelul de aur al Rusiei" (în vremurile străvechi pentru a fi forțate), ruta turistică, inclusiv o rețea de orașe rusești vechi: Sergiev Posad, Pereslavl-Zlessky, Rostov Mare, Yaroslavl, Kostroma, Ples, Vladimir, Bogolyubovo, Suzdal, Yuryev-Polish, Uglich. Numele locului este în primul rând geografic, a implicat tot ceea ce a fost "în spatele pădurii" în legătură cu Kievan Rus.
Traseul turistic (acte de la începutul anului 1970), așezat prin orașe istorice, trece prin teritoriul celor cinci regiuni - Moscova, Yaroslavl, Kostroma, Ivanovo, Vladimir. Orașele antice ale acestor terenuri au propriul lor destin, trecutul lor. Ei au făcut o cale provocatoare în dezvoltarea lor istorică din primele zile de naștere până astăzi. Mult pierdut iremediabil pe această cale lungă. Indiferența și neglijența duc la distrugerea parțială sau completă a clădirilor unice, exemplul orașului Calyazin, Mologa, Uglich. Atunci când construim stația hidroelectrică Uglich, vechea mănăstire Pokrovsky cu monumente unice de 15-17 secole a intrat sub apă. Jumătate bisericile de cărbune au fost demolate, dezasamblate gardurile mănăstirilor, care și-au distrus integritatea ansamblului. Eforturile restauratorilor au reușit să se retragă din urgență și să salveze de la moartea de zeci de obiecte de arhitectură veche, părea ireparabil pierdut. Revenit la viață în forma lor originală: Ansamblul arhitectural al mănăstirii învierii (1674-77) Uglich, Templul Pokrovului la Nerley (secolul al XII-lea), Catedrala Dmitrievski (secolul al XII-lea) și Poarta de Aur Vladimir, Catedrala Sf. George (Secolul al XII-lea) Yuriev-poloneză, monumente ale vechiului Suzdal, unde lucrează integrat de restabilirea dezvoltării istorice în întregul oraș, un oraș muzeu. Din nou, complexe arhitecturale întregi ale muzeelor \u200b\u200bde arhitectură din lemn din Kostroma, Suzdal. Toate acestea - creațiile mâinilor omului, atinse teritoriilor protejate ale țării rusești.
