Kuinka käyttää CSS: ää fontin värin vaihtamiseen

Haluatko piristää verkkosivustoasi eri fontin väreillä? Voit tehdä tämän käyttämällä CSS: ää. CSS on lyhenne sanoista Cascading Style Sheets, ja se on oletuskieli, jota käytetään minkä tahansa verkkosivuston tyylin luomiseen ja hallintaan.

On kolme tapaa soveltaa CSS: ää HTML-dokumenttiin. Näitä ovat sisäinen CSS, sisäinen/sulautettu CSS ja ulkoinen CSS.

Tapa yksi: Sisäinen CSS

Jos haluat muuttaa fontin väriä CSS: ssä, sinun on luotava CSS-sääntö määrittääksesi sen väriomaisuuden arvo.

Sisäinen menetelmä käyttää tyyliominaisuutta, jota voit käyttää melkein mihin tahansa elementtiin. Tässä on esimerkki, joka asettaa HTML-kappaleen fontin värin punaiseksi:

Tekstin kappale

Voit saavuttaa saman vaikutuksen käyttämällä sisäistä/sulautettua CSS: ää tai ulkoista CSS: ää.

Tapa kaksi: sisäinen/sulautettu CSS

Voit käyttää tätä menetelmää, kun haluat luoda CSS-sääntöjä, jotka vaikuttavat useampaan kuin yhteen HTML-elementin esiintymään, mutta vain yhdelle sivulle. CSS-säännöt kirjoitetaan sitten HTML-sivun päähän käyttämällä tyylielementtiä:

Tapa 3: Ulkoinen CSS

Kolmas tapa saavuttaa sama vaikutus on käyttää ulkoista CSS-tyylitaulukkoa. Luo tekstieditorilla tiedosto, jonka tunniste on ".css". Yleinen käytäntö on kutsua tätä tiedostoa jollain tavalla stylesheet.css mutta voit nimetä sen miksi tahansa, kunhan säilytät ".css"-tunnisteen.

Jos haluat värittää leipätekstisi vihreäksi esimerkiksi ulkoisen tyylisivun avulla, liitä CSS-sääntö seuraavasti:

p { väri: sininen }

HTML-dokumentissasi tulee sisällyttää linkki tyylisivuusi HTML head -elementtiin:

Tekstin kappale

Fontin värin muuttaminen HTML: ssä ilman CSS: ää

Paras käytäntö on käyttää CSS: ää, mutta näin voit muuttaa fontin väriä pelkän HTML: n avulla:

Tekstin kappale

Fonttielementti ja sen color-attribuutti on vanhentunut. Tämä johtuu siitä, että ne ovat pikemminkin esillepanollisia kuin rakenteellisia elementtejä. Nykyaikaisen HTML: n tulee koostua vain rakenteellisista elementeistä.

Fonttivärin muuttaminen CSS: ssä on suhteellisen yksinkertaista

Olemme näyttäneet sinulle kolme tapaa muuttaa fontin väriä CSS: ssä. Olemme myös näyttäneet sinulle, kuinka tämä tehdään vanhalla tavalla HTML-fonttitunnisteen avulla. Kokeile niitä ja katso mikä toimii sinulle parhaiten!

Kun olet oppinut muuttamaan fontin väriä CSS: n ja HTML: n avulla, saatat haluta hallita fonttikoon muuttaminen HTML: ssä.

Kuinka muuttaa HTML-fonttikokoa CSS: ssä

Lue Seuraava

Kirjailijasta