Sposobnost oblikovanja različnih vidikov vaše strani HTML je pomembna veščina za spletne oblikovalce in razvijalce. Če želite svoje spletne strani HTML oblikovati z barvami in velikostmi pisave, morate poznati CSS. Če želite natančno ciljati na velikost pisave, lahko uporabite CSS velikost pisave lastnine.

Če iščete način za spreminjanje velikosti pisave HTML z uporabo CSS, smo za vas. Poglobimo se tako, da začnemo z uvodom v CSS velikost pisave lastnine.

Razumevanje lastnosti velikosti pisave CSS

The velikost pisave lastnost v CSS je priročna, ko morate spremeniti velikost besedila HTML. To lastnost lahko uporabite za spreminjanje velikosti vsakega dela besedila na strani HTML ali ciljanje na določene elemente, ki jih želite spremeniti.

Ciljanje na določene elemente je običajno priporočeno, saj običajno ne želite, da bi imeli vsi enako velikost. Besedilo, ki ne sledi vizualni hierarhiji, je težko pregledati in ločiti naslove višje ravni od naslovov na nizki ravni.

Preprosteje povedano, ne zlorabljajte

velikost pisave lastnine. Če želite, da naslov izstopa, za to obstajajo različne oznake naslovov HTML. Oglejte si naše HTML bistveni goljuf za različne oznake, atribute in drugo skupaj s pojasnili.

CSS velikost pisave Lastnost ima dve vrsti vrednosti: absolutno in relativno.

Vrednosti absolutne dolžine (tj. px) so fiksni, medtem ko so relativni (npr. em in npr) so prilagodljivi. Na primer za enoto, ki se nanaša na pisavo, kot je em, je velikost običajno določena z velikostjo pisave nadrejenega elementa. Vendar pa korenske enote, ki so povezane s pisavo, npr rem nanje vpliva velikost pisave korenskega elementa ().

Vsaka ima svoje prednosti in slabosti, toda v bistvu ohranjanja osredotočenosti o njih v tem članku ne bomo razpravljali.

Kako spremeniti velikost pisave elementa HTML v CSS

Velikost pisave besedila HTML lahko spremenite z uporabo standardne sintakse CSS.

Najprej določite izbirnik (besedilo, ki ga želite spremeniti) in odprite nekaj zavitih oklepajev. Nato vnesite velikost pisave lastnost, ki ji sledi dvopičje, določite določeno velikost, v kateri želite, da se prikaže vaše besedilo HTML, in ga zaprite s podpičjem.

Tukaj je sintaksa:

Izbirnik CSS {
 velikost pisave: vrednost;
}

Če želite bolje razumeti koncept, preglejte naslednjo shemo HTML, ki ima nekaj dodatnih vrstic kode (naslov in odstavek):

To je moj prvi naslov

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Če želite spremeniti velikost pisave elementa odstavka, ga morate izbrati (prek razreda, oznake ali id) in z uporabo CSS velikost pisave lastnost, nastavite vrednost po meri s svojimi želenimi enotami. V našem primeru bomo uporabili slikovne pike (px).

p {
 velikost pisave: 18px;
}

Čeprav vgrajeni CSS na splošno ni priporočljiv pri velikih projektih, ga lahko uporabite tudi za spreminjanje velikosti besedila HTML. Če vzamemo opombe iz zunanje kode CSS zgoraj, lahko isto stvar implementiramo v vrstico tako:

To je moj prvi naslov

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Besedilo v str Oznaka HTML bo zdaj imela novo velikost po meri.

Povezano: Bistveni CSS nasveti in triki, ki bi jih moral poznati vsak razvijalec

Odpravljanje napak pri spreminjanju velikosti pisave HTML v CSS

Čeprav se celoten postopek spreminjanja velikosti besedila v CSS morda zdi enostaven, se morda ne bo vedno izkazal točno tako, kot pričakujete. Če imate težave, najprej preverite, ali ste shranili spremembe v datoteko (poskrbite tudi, da ste svoj list CSS povezali z datoteko HTML). Če ste, poskusite uporabiti inline metodo in nato osvežite stran.

Če deluje, je morda težava z vašo kodo CSS. Poskusite uporabiti !pomembno in če deluje, mora obstajati neka nasprotujoča si koda. Razčlenite svojo kodo CSS vrstico za vrstico, da poskusite ujeti to napako.

10 preprostih primerov kode CSS, ki se jih lahko naučite v 10 minutah

Potrebujete pomoč pri CSS? Za začetek preizkusite te osnovne primere kode CSS, nato jih uporabite na svojih spletnih straneh.

Preberite Naprej

O avtorju