Ungayishintsha kanjani Imibala Yezinhlamvu Zamawebhusayithi Nge-CSS

Idizayini enhle ye-typographic ingxenye ebalulekile ye-website ephumelelayo. I-CSS ikunika ukulawula okuhle ngokubonakala kombhalo kumakhasi wewebhu amakhasi wewebhu oyakhayo. Lokhu kuhlanganisa ikhono lokushintsha umbala wamafonti oyisebenzisayo.

Imibala yefonti ingashintshwa ngokusebenzisa ishidi langaphandle lesitayela , ishidi langaphakathi lesitayela , noma lingashintshwa ngokusebenzisa isitayela se-inline ngaphakathi kwedokhumenti ye-HTML. Imikhuba emihle yenza ukuthi kufanele usebenzise ishidi langaphandle lesitayela zezitayela zakho ze-CSS. Ishidi langaphakathi lesitayela, okuyizitayela ezilotshwe ngqo "ekhanda" lwedokhumenti yakho, ngokuvamile lisetshenziselwa izingosi ezincane, ezilodwa zamakhasi. Izitayela ze-Inline kufanele zigwenywe ngoba zihambisana namathegi endala "wefonti" esasiphatha ngayo eminyakeni eminingi edlule. Lezo zitayela ezifakiwe zenza kube nzima kakhulu ukuphatha isitayela sefonti ngoba kuzodingeka uzishintshe kuzo zonke izici zesitayela esingaphakathi.

Kulesi sihloko, uzofunda ukuthi ungashintsha kanjani umbala wefonti usebenzisa ishidi langaphandle lesitayela nesitayela esisetshenziswe kumaki wendima. Ungasebenzisa isakhiwo sesitayela esifanayo ukushintsha umbala wefonti kunoma iyiphi ithegi ezungeze umbhalo, kuhlanganise womzimba.

Ukwengeza Izitayela Ukushintsha Umbala Wefonti

Kulesi sibonelo, kuzodingeka ube nombhalo we-HTML wekhasi lakho lekhasi kanye nefayela elihlukile le-CSS elihlanganisiwe kulolo dokhumenti. Idokhumenti ye-HTML ingase ibe nenani lezici kulo. Lowo esikukhathalelayo ngenhloso yalesi sihloko yisigaba sepharagrafu.

Nakhu ukuthi ungashintsha kanjani umbala wefonti wombhalo ngaphakathi kwamathegi wesigaba usebenzisa ishidi lakho lesitayela sangaphandle.

Amanani ombala angaboniswa njengamagama angukhiye wombala, izinombolo zombala we-RGB, noma izinamba zombala we-hexadecimal.

  1. Engeza isici sesitayela somaka wendima:
    1. p {}
  2. Beka impahla yombala ngesitayela. Faka ikholoni ngemuva kwalowo mhlaba:
    1. p {umbala:}
  3. Bese wengeza inani lakho lembala emva kwendawo. Qinisekisa ukuqeda lelo xabiso nge-colon-semi:
    1. p {umbala: omnyama;}

Izigaba ekhasini lakho manje zizoba mnyama.

Lesi sibonelo sisebenzisa igama elingukhiye lombala - "omnyama". Leyo yindlela eyodwa yokwengeza umbala ku-CSS, kodwa kunciphisa kakhulu. Ukusebenzisa amagama angukhiye athi "abamnyama" futhi "abamhlophe" kuqondile ngoba leyo mibala emibili iqondile, kodwa kwenzekani uma usebenzisa amagama angukhiye afana no- "obomvu", "okwesibhakabhaka" noma "ohlaza"? Impela uyothola umthunzi obomvu, obomvu, noma obuluhlaza? Awukwazi ukucacisa ukuthi imuphi umthunzi wombala oyifunayo ngamagama angukhiye. Yingakho amanani we-hexadecimal asetshenziswa njalo esikhundleni samagama angukhiye.

p {umbala: # 000000; }}

Lesi sitayela se-CSS sizobeka umbala wezindima zakho kumnyama, ngoba ikhodi ye-hex ye # 000000 ihumusha kumnyama. Ungasebenzisa ngisho nokunciphisa nge-value ye-hex bese uyibhala njenge-# 000 kuphela futhi uzothola into efanayo.

Njengoba sesishilo kakade, amanani we-hex asebenza kahle uma udinga umbala ongewona omnyama noma omhlophe nje. Nasi isibonelo:

p {umbala: # 2f5687; }}

Leli xabiso le-hex lingabeka izindima kumbala ohlaza okwesibhakabhaka, kodwa ngokungafani negama eliyisihluthulelo "oluhlaza okwesibhakabhaka", le khodi ye-hex ikunika ikhono lokusetha umthunzi othize obala okwesibhakabhaka - mhlawumbe lowo umklami ukhetha ngenkathi edala isikhombimsebenzisi le website. Kulesi simo, umbala uzoba phakathi kwebanga, i-slate-like blue.

Ekugcineni, ungasebenzisa amanani ombala we-RGBA wembala yefonti kanye. I-RGCA manje isekelwe kuzo zonke iziphequluli zanamuhla, ngakho ungasebenzisa lezi zimiso ngokungakhathazeki ukuthi ngeke zisekelwe kusiphequluli sewebhu, kodwa ungase futhi usethe i-backback elula.

p {umbala: rgba (47,86,135,1); }}

Leli xabiso le-RGBA lifana nombala ohlaza okwesibhakabhaka oshiwo ekuqaleni. Izindinganiso zokuqala ezingu-3 zibeka amanani we-Red, Green, neBlue futhi inombolo yokugcina iyilungiselelo le-alpha. Isethelwe ku- "1", okusho ukuthi "100%", ngakho lo mbala ngeke ube nokukhanya. Uma ubeka lokho kumbolo yedesimali, njenge -85, izohumusha ku-85% opacity futhi umbala uzobe ubala kancane.

Uma ufuna ukushayipha izimpawu zakho zombala, uzokwenza lokhu:

p {
umbala: # 2f5687;
umbala: i-rgba (47,86,135,1);
}}

Le syntax isetha ikhodi ye-hex kuqala. Ibeka phansi leyo mali ngenani le-RGBA. Lokhu kusho ukuthi noma yisiphi isiphequluli esidala esingasisekeli i-RGBA izothola inani lokuqala futhi lingayinaki lesibili. Iziphequluli zanamuhla zingasebenzisa okwesibili ngalolu css.