Sut i Newid Lliw Word Gyda'r Tag Span a CSS

Gyda CSS , mae'n hawdd gosod lliw testun mewn dogfen. Os ydych am i baragraffau ar eich tudalen gael eu rendro mewn lliw penodol, nodwch hynny yn eich dalen arddull allanol a bydd y porwr yn arddangos eich testun yn y lliw a ddewiswyd. Beth sy'n digwydd, pan fyddwch chi eisiau newid lliw un gair (neu efallai ychydig o eiriau) o fewn paragraff o destun? Ar gyfer hynny, bydd angen i chi ddefnyddio elfen fewnol fel y tag.

Yn y pen draw, mae newid lliw un gair neu grŵp bychan o eiriau o fewn brawddeg yn hawdd gan ddefnyddio CSS, ac mae'r tagiau yn HTML ddilys, felly peidiwch â phoeni am fod rhyw fath o darn. Gyda'r dull hwn, byddwch hefyd yn osgoi defnyddio tagiau a phriodoleddau digyflog fel "ffont", sy'n gynnyrch o gyfnod HTML a ddisgwylir.

Mae'r erthygl hon ar gyfer dechrau datblygwyr gwe sy'n debygol o fod yn newydd i HTML a CSS. Bydd yn eich helpu i ddysgu sut i ddefnyddio'r tag HTML a CSS i newid lliw testun penodol ar eich tudalennau. Wedi dweud hynny, mae yna rai anfanteision i'r dull hwn, a byddaf yn ei gynnwys ar ddiwedd yr erthygl hon. Am y tro, darllenwch ymlaen i ddysgu'r camau i newid y lliw testun hwn! Mae'n hawdd iawn a dylai gymryd tua 2 funud.

Cam wrth Gam Cyfarwyddyd

  1. Agorwch y dudalen we rydych chi am ei ddiweddaru yn eich hoff golygydd HTML testun. Gallai hyn fod yn rhaglen fel Adobe Dreamweaver neu golygydd testun syml fel Notepad, Notepad ++, TextEdit, ac ati.
  2. Yn y ddogfen, lleolwch y geiriau yr hoffech eu harddangos mewn lliw gwahanol ar y dudalen. Er mwyn y tiwtorial hwn, mae'n gadael i chi ddefnyddio rhai geiriau sydd o fewn paragraff mwy o destun. Bydd y testun hwnnw yn cael ei gynnwys yn y pair thetag. Dod o hyd i un o ddau eiriau y byddech chi'n hoffi eu lliwio.
  3. Rhowch eich cyrchwr cyn y llythyr cyntaf yn y gair neu'r grŵp o eiriau yr ydych am newid lliw. Cofiwch, os ydych chi'n defnyddio golygydd WYSIWYG fel Dreamweaver, rydych chi'n gweithio'n gadarn yn awr.
  4. Gadewch i chi lapio'r testun y mae arnom eisiau newid gyda liw, gan gynnwys priodoldeb dosbarth. Efallai y bydd y paragraff cyfan yn edrych fel hyn: Dyma destun sy'n canolbwyntio ar ddedfryd.
  5. Yr ydym newydd ddefnyddio elfen mewnline, sef, i roi'r testun penodol hwnnw yn "bachyn" y gallwn ei ddefnyddio yn CSS. Ein cam nesaf yw neidio i'n ffeil CSS allanol i ychwanegu rheol newydd.
  1. Yn ein ffeil CSS, gadewch i ni ychwanegu:
    1. .focus-text {
    2. lliw: # F00;
    3. }
    4. Deer
  2. Byddai'r rheol hon yn gosod yr elfen inline, y, i'w arddangos yn y lliw coch. Pe bai gennym arddull flaenorol a oedd yn gosod testun ein dogfen i ddu, byddai'r arddull inline hon yn achosi ffocws ar y testun rhychwant a sefyll allan gyda'r lliw gwahanol. Gallem hefyd ychwanegu arddulliau eraill i'r rheol hon, gan wneud y testun yn italig neu feiddgar i'w bwysleisio hyd yn oed yn fwy?
  3. Arbedwch eich tudalen.
  4. Profwch y dudalen yn eich hoff borwr gwe i weld y newidiadau yn effeithiol.
  5. Sylwch fod rhai gweithwyr proffesiynol y we, yn ychwanegol at y rhai, yn dewis defnyddio elfennau eraill fel y parau neu bara tag. Roedd y tagiau hyn yn arferol ar gyfer "bold" a "italics" yn benodol, ond roeddent yn cael eu diystyru a'u disodli ac. Mae'r tagiau'n dal i weithio mewn porwyr modern, fodd bynnag, mae cymaint o ddatblygwyr gwe yn eu defnyddio fel bachau arddull mewnol. Nid dyma'r ymagwedd waethaf, ond os ydych chi am osgoi unrhyw elfennau heb eu hesgeuluso, awgrymaf gadw at y tag am y mathau hyn o anghenion arddull.

Cynghorau a Pethau i'w Gwarchod

Er bod yr ymagwedd hon yn gweithio'n iawn ar gyfer anghenion stylio bach, fel pe bai angen i chi newid dim ond un darn bach o destun mewn dogfen, gall gyflym fynd allan o reolaeth. Os gwelwch fod eich tudalen wedi'i llenwi â elfennau inline, ac mae gan bob un ohonynt ddosbarthiadau unigryw yr ydych yn eu defnyddio yn eich ffeil CSS, efallai y byddwch chi'n ei wneud yn anghywir, Cofiwch, y mwyaf o'r tagiau hyn sydd yn eich tudalen, y mae'n anoddach yn debygol o fod i gynnal y dudalen honno ymlaen. Yn ogystal, anaml iawn y mae teipograffeg gwe dda y mae yna lawer o amrywiadau o liw ac ati ar hyd y dudalen!