Kuidas kasutada CSS-i fondi värvi muutmiseks

Kas soovite oma veebisaiti erinevate fondivärvidega kaunistada? Seda saate teha CSS-i abil. CSS tähistab Cascading Style Sheets'i ja on vaikekeel, mida kasutatakse mis tahes veebisaidi stiilide loomisel ja haldamisel.

CSS-i rakendamiseks HTML-dokumendile on kolm meetodit. Need on tekstisisene CSS, sisemine/manustatud CSS ja väline CSS.

Esimene meetod: tekstisisene CSS

CSS-i fondi värvi muutmiseks peate selle määramiseks looma CSS-i reegli värvi omaduse väärtus.

Tekstisisene meetod kasutab stiili atribuuti, mida saate rakendada peaaegu igale elemendile. Siin on näide, mis määrab HTML-i lõigu fondi värvi punaseks:

Teksti lõik

Sama efekti saate saavutada sisemise/manustatud CSS-i või välise CSS-i abil.

Teine meetod: sisemine/manustatud CSS

Seda meetodit võite kasutada, kui soovite luua CSS-i reegleid, mis mõjutavad rohkem kui ühte HTML-elemendi eksemplari, kuid ainult ühel lehel. Seejärel kirjutatakse CSS-i reeglid HTML-lehe päisesse, kasutades stiilielementi:

Kolmas meetod: väline CSS

Kolmas viis sama efekti saavutamiseks on välise CSS-laaditabeli kasutamine. Looge tekstiredaktoriga fail laiendiga ".css". Üldlevinud tava on nimetada seda faili millegi sarnaseks stiilileht.css kuid võite sellele nimetada mis tahes, kui säilitate laiendi ".css".

Kehateksti roheliseks värvimiseks näiteks välise laaditabeli abil kleepige lihtsalt CSS-i reegel järgmiselt:

p { värv: sinine }

HTML-dokumendis peaksite HTML-i peaelemendi sisse lisama lingi oma stiililehele:

Teksti lõik

HTML-i fondi värvi muutmine ilma CSS-i kasutamata

Parim tava on kasutada CSS-i, kuid ainult HTML-i kasutades saate fondi värvi muuta järgmiselt.

Teksti lõik

Fondielement koos selle värviatribuudiga on aegunud. Seda seetõttu, et need on pigem esitluslikud kui struktuurielemendid. Kaasaegne HTML peaks koosnema ainult struktuurielementidest.

CSS-i fondi värvi muutmine on suhteliselt lihtne

Näitasime teile kolme meetodit fondi värvi muutmiseks CSS-is. Samuti oleme teile näidanud, kuidas seda teha vanal viisil, kasutades HTML-fondi märgendit. Proovige neid ja vaadake, mis teile kõige paremini sobib!

Kui olete õppinud CSS-i ja HTML-i abil fondi värvi muutma, võite soovida õppida HTML-i fondi suuruse muutmist.

Kuidas muuta HTML-i fondi suurust CSS-is

Loe edasi

Autori kohta