Peamised HTML-i teksti vormindamise sildid - teksti valik rasvases kirjas ja kaldkirjas; Suuruse parameetrid, värvid ja fondid; Lõige ja sildid pealkirju. Rasva tekst CSS HTML-fondi pealkiri

Täna ma ütlen teile, kuidas teha sõnu julge fonte saidi kasutades HTML ja CSS. Seda disaini kasutatakse siis, kui soovite leheküljel teatud teavet esile tõsta. Lisaks ei ole mitte ainult pealkirju, vaid ka lihtsate sõnade, teksti fraaside kohta. See on lihtsalt piisavalt rakendatud.

Teatud teksti esiletõstmiseks kasutatakse spetsiaalseid HTML-silte. ja . Näiteks järgmine kood:

Tavaline tekst.

Pisipilt.

Julge tugev.

Tavaline tekst.

Pisipilt.

Julge tugev.

Väljundil annab sellise pildi:

Viimase kahe võimaluse visuaalselt näevad samad, kuid need erinevad üksteisega veidi. Tag Määrab sõna lihtsa stilistilise esiletõstmine rasvase fondiga, samas kui See lisab mõningase semantilise "täiustatud" (oluline) väärtus. See tähendab, et viimane rida ei ole lihtsalt julge tekst, vaid mõni oluline teave. Põhimõtteliselt soovitavad otsingumootorite kasutamine seda kasutada .

Võite ka vastata HTML-is ettenähtud rasva font stiilidega:

Näide julge teksti.

Näidete tekst S. rasva Lühidalt.

Saidil kuvatakse niimoodi:

Hoolimata asjaolust, et HTML-i julge tekstikood töötab õigesti, ei tee seda. Kõik disaini stiile tuleb teha CSS-failis. Seega, ülaltoodud näites, oleksite pidanud silte olema

Ja Määrake sobiv klass ja registreerige see disain stiilis lehel. Sellised on koodeksi registreerimise eeskirjad. Seetõttu kasutage julge font HTML-is .

Julge tekst css

Selleks, et teha kindel font CSS-is, kasutatakse fondi kaal vara. Sellega on näidatud tekstifragmendi "küllastus". Väärtused võivad olla 100 kuni 900, kuid kõige sagedamini kasutatakse seda:

  • bold (rasv) - 700 vaikimisi;
  • normaalne (normaalne) - 400 vaikimisi.

Samuti on valikuid pullide ja kergemate väärtuste jaoks, mis muudavad fondi sõltuvalt vanemast rohkem või vähem rasva.

CSS-i julge teksti seadmiseks vajate näiteks teist stiili, näiteks näiteks:

Tavaline tekst S. rasva valik keskel.

tugev (fondi kaal: julge;)

Siin ma tahtsin tähistada ühe väikese nüansi, mida mulle öeldi - kui loote mõne elemendi jaoks uue klassi, on soovitav kasutada enam-vähem "arusaadavat nime". Näiteks näites stiilis klassi \u003d "Minu-Bold-font" tundub loogilisem kui klass \u003d "New-font", sest Te saate selle eesmärgi osaliselt mõista. See on pluss neile, kes näevad ja kasutavad oma paigutust tulevikus.

Järgmises artiklis ma ütlen teile huvitavate rasva fontide kohta, mida mul õnnestus leida.

HTML-fondi suurusel mängib olulist rolli. See võimaldab teil juhtida tähelepanu kasutajale olulist teavet kohalehel. Kuigi mitte ainult tähtede suurus on oluline, vaid ka nende värv, paksus ja isegi perekond.

Sildid ja atribuudid robotiga HTML-fontidega

Hypertext'i keeles on fontidega töötamiseks suur hulk vahendeid. Lõppude lõpuks on teksti vormindamine HTMLi peamine ülesanne.

HTML-keele loomise põhjus on muutunud teksti vormindamise reeglite brauserite kuvamise probleemiks.


Kaaluge silte, mida kasutatakse töötamiseks fonte HTML-i ja nende atribuutidega. Peamine on tag . Kasutades oma atribuutide väärtusi, saate määrata mitu fondi omadusi:

  • värv - seab teksti värvi;
  • suurus - fondi suurus tingimusühikutes.

Positiivse atribuudi väärtust toetatakse 1 kuni 7.

  • face - kasutatud installida teksti fontide perede, mida kasutatakse sildi sees . Mõned koma kaudu loetletud väärtused toetatakse kohe.

Ainult teksti, mis asub fondipaari sildi osa vahel, on vormindatud. Ülejäänud tekst kuvatakse vaikimisi installitud standard font.

Ka HTML-is on mitmeid paari silte, mis määravad ainult ühe vormindamise reegli. Need sisaldavad:

  • - täpsustab HTML-i julge font. Tag teistega sarnane toimega;
  • - suurus on suurem kui vaikimisi komplekti;
  • - Väiksem fondi suurus;
  • - kaldu tekst (kaldkirjas). Sarnane silt ;
  • - rõhu allkirjastatud tekst;
  • - rõhutas;
  • - Näita teksti ainult väiketähti;
  • - suurtähtis.

Tavaline tekst

Pisipilt

Pisipilt

Tavalisem

Vähem tavaline

Kursiivkiri

Kursiivkiri

Rõhuasetusega

Purustatud

Stiili atribuudi omadused

Lisaks kirjeldatud siltetele on veel mitmeid viise, kuidas fondi muutmiseks HTML-is muuta. Üks neist on stiili universaalse atribuudi kasutamine. Kasutades oma omaduste väärtusi, saate määrata fondi kuvamise stiili:

1) Font-pere - vara määrab fondipere. Saate loetleda mitmeid väärtusi.
Fondi muutmine HTML-is järgmisse väärtuse juurde, kui eelmine perekond ei ole kasutaja operatsioonisüsteemi installitud.

Kirjutamise süntaks:

font-perekond: fondi nimi [, fondi nimi [, ...]]

2) Fondi suurus - suurus on seatud 1 kuni 7. See on üks peamisi viise, kuidas HTML-i saate fondi suurendada.
Kirjutamise süntaks:

font-suurus: absoluutne suurus Suhteline suurus | Väärtus | Intress | pärida.

Fondi suurust saab seadistada ka:

  • Pikslites;
  • Absoluutväärtuses ( xx-väike, x-väike, väike, keskmine, suur);
  • Sekkumises;
  • Punktid (PT).

Font-suurus: 7

Font-suurus: 24px

Font-suurus: x-suur

Fondi suurus: 200%

Fondi suurus: 24pt

3) Font-stiil - määrab fondi kirjutamise stiili. Süntaks:

font-stiil: Normal | Itaalia | Halv | pärida.

Väärtused:

  • normaalne -Normaalne kirjutamine;
  • kaldkirjas;
  • kaldus - font paremale kallakuga;
  • päry - pärsib vanemaelemendi kirjutamise.

Näide sellest, kuidas muuta fondi HTML-is selle vara abil:

font-stiil: pärida

font-stiil: kaldkirjas

font-stiil: normaalne

font-stiilis: kaldus

4) Font-variant - tõlgib kõik pealkirjale kõik suurtähted. Süntaks:

font-variant: Normaalne | Väikesed mütsid | pärida.

Näide sellest, kuidas muuta fondi HTML-i poolt selle vara järgi:

font-variant: pärida

font-variant: normaalne

font-variant: väikesed korgid

5) Font-kaal - võimaldab seadistada teksti kirjutamise paksuse (küllastus). Süntaks:

font-kaal: julge | Bolder | Lighter | Normaalne | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900

Väärtused:

  • bold - paigaldab julge HTML-fondi;
  • bolder - rasvane normaalse suhtes;
  • kergem on küllastunud võrreldes normaalse;
  • tavaline - tavaline kirjutamine;
  • 100-900 - Fondi paksus on määratud numbrilise ekvivalendiga.

font-kaal: julge

font-kaal: julgem

font-kaal: kergem

font-kaal: normaalne

font-kaal: 900

font-kaal: 100

Font vara ja HTML-fondi värv

Font on teine \u200b\u200bkonteineri vara. Sees kombineeris see mitmete omaduste väärtusi, mis on mõeldud fontide muutmiseks. Süntaksi font:

font: fondi suuruse font-pere | pärida.

Samuti saab süsteemi poolt mitmesuguste juhtimisseadiste kirjete jaoks kasutatavad fonte määrata väärtusena.

  • pealdis - nuppude jaoks;
  • ikoon - ikoonide jaoks;
  • menüü - menüü;
  • sõnum-Box - dialoogiboksid;
  • väike-pealdis - väikeste kontrollide puhul;
  • olekuriba - staatuse string font.

font: ikoon

font: pealkiri

font: menüü.

font: sõnumite kast

väike pealkiri.

font: olekuriba

font: Italic 50px Bold "korda New Roman", Times, Serif

Fondi värvi määramiseks HTML-is saate kasutada värvi vara. See võimaldab teil värvi määrata nii märksõna ja RGB-vormingus. Samuti heksadecimaalse koodi kujul.

Tere, Lugupeetud blogi lugejad! See artikkel räägib teksti vormindamise sildid. Heledad näited on teksti valik rasvases või kaldkirjas. Samuti kaalume mõningate silte mõju koha sisemise optimeerimise ja nende kirjutamise eeskirjade mõju. Umbes siis saate lugeda ülaltoodud artiklis. Muide, saate täita sarnaste tekstiprojektide elementide paljude tekstiredaktoritega, näiteks sõna.

Sildid on jagatud kahetüübiks: plokk ja väiketähti. Esimese kasutamisel saate muuta teksti teksti (read, eraldi fragmendid või sõnad) sisu ja teine \u200b\u200bon. Sellises artiklis käsitletavad vormindamise sildid on peamiselt madalamad kui.

Sildite kirjutamise reeglid ja kord

Sa tead juba, mis avab ja sulgeb sildid. Kui ei, lugege artiklit selle materjali alguses. Lühidalt öeldes on sildid kahte tüüpi: ühekordse (näiteks ülekande uuele stringile
) ja konteiner (paar). Niisiis, kõik tekstivormingu sildid on parnn. See tähendab, et iga element on sildid avavad ja sulgevad ja eraldatud fragment tuleb nende vahel paigutada. Näiteks näeb välja fraasi õige valik: Spetsiaalne fragment

Kui brauser töötleb seda fragmenti, näete seda teksti: Spetsiaalne fragment.Muide, RSS-i lindi puhul ei kuvata kõiki silte ().

Peaasi, kui silte kirjutamine - ärge unustage neid sulgeda. Vastasel juhul eemaldatakse kogu lehekülg tekst rasva (sildiga näites ). Aga seal on selliseid juhtumeid, kui teil on vaja rõhutada teatud fragment ja julge ja kaldkirjas samal ajal. Kuid tag, mis seda tegevust teostab, ei ole olemas. Sellist olukorda väljumist on üks: kasutage samal ajal kahte silte. Millises järjekorras ei ole nende kasutamise järjekorras. Seetõttu kirjutades teksti silte selliste sildid:

Spetsiaalne fragment

või niimoodi:

Spetsiaalne fragment

Sa ikka veel Spetsiaalne fragment itaaliv ja rasva samal ajal. Siiski on eelistatav kasutada esimest võimalust, sest see oli algselt ainus ja õige. Samuti ärge unustage, et iga brauser saab töödelda silte erinevatel viisidel (), sõltuvalt seadetest. Ja nüüd pöördume ise sildi poole

Teksti valimine rasvases ja kaldkirjas - sildid , , ja

Kõige populaarsemad tekstivormingu sildid rõhutavad seda. rasva ja kald-. Tavaliselt kasutatakse neid mis tahes fragmendi tähtsuse andmiseks. Esimest juhtumit kasutatakse kasuliku teabe või märksõnade fragmendi esiletõstmiseks. Italic kehtib samaks otstarbeks rasvtekstina, kuid teave on vähem oluline, sest see tähendab põhilise teksti taustal, mis on vähem märgatav kui rasva tekst.

Kaaluge algust teksti valimine õline. Selle tegevuse jaoks kasutatakse kahte silte - ja . Välimus puudub erinevus. Kuigi arvestades asjaolu, et iga brauser saab tõlgendada iga elementi omal moel, näete mis tahes erinevusi. Siin on see, mida tekst näeb silte ja Juba töödeldud brauseri kujul:

Tekst tugev silte

Tekst silte B

Aga millised on kaks rida lehe allikale lehekülge näeb välja nagu:

Tekst tugev silte Tekst silte B

Sama olukord saame järgida juhul valiku märgendid kaldkirjas ja . Püüdke leida erinevusi kahe näite vahel:

Tekst em silte

Tekst silte I

Aga lähtekood:

Tekst em silte Tekst silte I

Niisiis, arutatud heakskiidumärgised rasvases ja kaldkirjas ei ole tegelikult erinevad, vaid siis me näiteks me näiteks märgme Kui seal ? Lõppude lõpuks sisaldab viimane ainult ühte märki (ei loeta sulgudes) ja seetõttu on lihtsam kirjutada. Ja asi on see, et tags ja Mõjutada. Kui te ümbritsete neid silte märksõnu, kasu saidi edendamisest. See ei tohiks seda üle pingutada - maksimaalne tekstis peaks olema 5% tag-i fatte tekstist ja sama ja kursiivne sildi .

Kui soovite lihtsalt teksti esile tõsta, siis kasutage sildi või . Üldiselt arvan, et otsingumootorid kaaluvad ka nende silte teksti olulisemaks, kuid edasi sisemine optimeerimineneil on veel väiksema mõju kui ja .

Teksti valiku sildid - , ja

Nüüd kaaluge mitmeid silte, mis kasutavad teksti disainis. Kõige kuulsam teile teksti toimetajatest - tag või rõhu all. Mõju reitingule See tag ei \u200b\u200b(niipalju kui ma tean), kuid eraldada mis tahes teksti ja keskenduda sellele aitab. Näide selle sildi kasutamisest, mida ma veidi kõrgem tõusin.

Kaks sarnase iseloomuga märgise eesmärgiga - ja . Mõlemad täidavad teksti kiirendamisfunktsiooni. Võite seda sildi kasutada mis tahes olukordades: kui uuendate dokumendi (või selle pigem osa), saate ületada vana ja lisada uue; Kui te kavatsete kirjutada midagi, mis jätab materjali teema; Midagi, mis ei vasta moraalsetele ja eetilistele standarditele.

Nende kahe sildi erinevused on ainult nende kirjandusSelle tulemusena on eelistatav kasutada esimese, sest Esiteks on mugavam kirjutada ja teiseks, teie leht on väiksem kui HTML-kood ja otsingumootorid nagu see.

Tag ja atribuudid - teksti fondi parameetrid

Nüüd kaaluge sildi, mida ei kasutata ilma atribuutideta. Sellega saate määrata parameetrid teksti spetsiifilise fragmendi jaoks. Üldiselt on nüüd eelistatav kasutada (kaskaadimislehte), sest Nende abiga saate tugevalt vähendada kogu HTML-lehekülje koodi. Nii kaaluge väga sildi . Sest see on ainult kolm atribuuti:

  • nägu. - Font ise. Näiteks Arial, Courier või Verdana. Saate loetleda mitu, sest Mitte kõigil kasutajatel on ulatuslik komplekt fonte ja kirjalikult nägu atribuut, brauser saab valida, mis kasutada või pigem - mis on olemas süsteemis;
  • suurus - atribuut, mis näitab teksti suurust. Seda saab väljendada nii tavapärastes ühikutes kui ka pikslites;
  • värv - Teksti värv. Seda atribuuti saab kasutada nii HTML-värvides värvide ja verbaalsesse. Esimesel on vorm #ffffff (kus f on iga number või kiri A-st f) ja teine \u200b\u200bon kirjutatud lihtsate sõnadega (näiteks punane punane).

Nii näeb välja nagu tag Iga atribuudi kasutamine:

See tekst on suurus 6px


See tekst on punane

Sellel tekstis on fontide aroom

See punase ja suurusega tekst 5px

Aga see, mida näete pärast kirjaliku koodi töötlemist:

Blokeeri teksti disaini elemendid - pealkirjad

-

lõik

Lõpuks vaatame ploki elemente, mida kasutatakse peaaegu igas dokumendis. Need on sildid pealkirju ja lõiget. Kaaluge esimest. Pealkirjad on 6 liiki ja igaühel on oma tag. Iga tüüp kannab ainult oma järjestuse numbri ja salvestatakse silte.

,

,...,

. Siin on see, mida päised näevad välja töödeldud kujul:

Nug pärast sõna päise vastab number sildi . Peatükkidel on suur mõju sisemisele optimeerimisele, seega järeldage silte Märksõnad. Käesoleva juhtumi omadused on üsna palju, mida ma hilisemates artiklites ütlen.

Ja nüüd räägime lõike jaotamise sildist

Selle tabeli funktsioon on teksti eraldamiseks teise teksti vahel tühja stringiga. Kui vaatate mis tahes dokumendi lähtekoodi, näete järgmist:

Rohelistes ristkülikes, üks lõik punane - teine. Aga kuidas see kood vaadelda brauseri töötlemise eest (nool näitab tühja stringi):

Selle tulemusena me saame üsna märgatava eraldamise ühe lõike teisest, mis on hea - lugemine muutub mugavamaks.

Mis tuli artikli lõpuni dokumendi vormindamise sildid. Nad on palju rohkem kui sellel materjalis kirjeldatud kui ma kirjeldasin. Lihtsalt mõningaid vajadust rääkida mõnevõrra mõningate kohta üsna palju öelda, nad on pühendunud individuaalsetele artiklitele täieliku ülevaate.!

Fattive Font määratakse CSS-i atribuudi abil fontide kaalmis võib võtta järgmisi väärtusi:

  • heledam. - Valgus
  • normaalne - normaalne
  • julge. - rasv
  • julgem. - rohkem rasva
  • 100..900 - 100 vastab parimatele fontidele; 900 - Tolstoi

Atribuut font-stiilis (Font joonis) teenib selle kirjutamist kaldkirjas ja võib võtta järgmisi väärtusi:

  • kald- - Teksti servad on ümardatud
  • normaalne - normaalne
  • kaldus. - kaldkirjas

Atribuut font-variant. (Fondi tüüp) on kirjutada väikeste suurtähtedega ja võib võtta järgmisi väärtusi:

  • normaalne - normaalne
  • smaoo-mütsid. - väike kapitali

Koos rasva, kaldkirjas ja väike kapitaliga on veel mõned populaarsed joonise liigid: allajoonide ja märgistamise all.


Atribuut teksti kaunistus. (Teksti kaunistamiseks) on tekst rõhutada ja võib võtta järgmisi väärtusi:

  • vilkuma. - Shimmering Tekst (st ei toetata)
  • läbi rea. - ületatud tekst
  • ükski - muudatusteta
  • Ülejääk - Line üle teksti
  • rõhutama - allajoonitud tekst

Atribuut teksti-teisendus (Teksti ümberkujundamine) teenib töötama väikeste patsientide tähtedega ja võib võtta järgmisi väärtusi:

  • kapitaliseerima - Kõik sõnad algavad suurtähtega
  • väiketähed - Kogu tekst on kirjutatud väiketähtedega
  • ükski - muudatusteta
  • suurtäht. - Kogu tekst on kirjutatud suurtähtedega

Näide kasutamisest fontide kaal, font-stiilis, teksti kaunistus., teksti-teisendus: Näide nr 9.

HTML-lehekülje kood:

Untitled.

"Venemaa kuldne rõngas" (iidsetel aegadel ühekordsetele aegadele), turismitee, sealhulgas iidsete Venemaa linnade võrgustik: Sergiev Posad, Pereslavl-Zalesssky, Rostov Suur, Yaroslavl, Kostroma, Ples, Vladimir, Bogolyubovo, Suzdal, Juryev-Poola, Uglich. Koha nimi on peamiselt geograafiline, see eeldas kõike, mis oli "metsa taga" seoses Kievan RUSiga.


Turismiliin (tegutseb 1970. aasta algusest), mis on paigutatud ajalooliste linnade kaudu, läbib viie piirkonna territooriumi - Moskva, Yaroslavl, Kostroma, Ivanovo, Vladimir. Nende maade iidsetel linnadel on oma minevikus oma saatus. Nad tegid oma ajaloolises arengus väljakutset esimesest sünnipäevadest kuni tänaseni. Palju pöördumatult kadunud selle pika tee juures. Igasugune ükskõiksus ja hooletus põhjustavad ainulaadsete hoonete osalist või täielikku hävitamist, Calyaziini linna näidet, MoloGa, Uglich. Umblichi hüdroelektrijaama ehitamisel läks iidse Pokrovski kloostri 15-17 sajandi ainulaadsete mälestistega vee alla. Half kiriku söe lammutati, demonteeritud aiad kloostrid, mis hävitas nende ansambli terviklikkuse. Taastajate jõupingutusi suutsid hädaolukorrast loobuda ja säästa vanu arhitektuuri kümnete esemete surmast, tundus, et taastunud. Elu tagasi oma algses vormis: ülestõusmise kloostri arhitektuurne ansambel (1674-77) Uglich, Pokrovi tempel Nerley (12. sajand), Dmitrievsky katedraal (12. sajand) ja Vladimir George'i katedraali kuldvärav (12. sajand) Juriev-Poola, iidse Suzdi mälestusmärgid, kus integreeritud teosed ajaloolise arengu taastamisel kogu linnas, muuseumi linn. Jällegi, kogu arhitektuurse kompleksid muuseumid puidust arhitektuuri Kostroma, Suzdal. Kõik see - inimte kättetoimetamise looming puudutas vene keele kaitstud alasid.