Met CSS is dit maklik om die kleur van die teks in 'n dokument te stel. As u wil hê dat paragrawe op u bladsy in 'n bepaalde kleur vertoon moet word, spesifiseer u dit slegs in u eksterne stylblad en die blaaier sal u teks in die gekose kleur vertoon. Wat gebeur dan as jy die kleur van slegs een woord (of dalk net 'n paar woorde) binne 'n paragraaf van teks wil verander? Hiervoor moet u 'n inlyn-element soos die merker gebruik.
Uiteindelik is die verandering van die kleur van 'n enkele woord of 'n klein groepie woorde binne 'n sin maklik om CSS te gebruik, en die etikette is geldige HTML, dus moenie bekommerd wees dat dit 'n soort hack is nie. Met hierdie benadering vermy jy ook die gebruik van afgedankte etikette en eienskappe soos "font", wat 'n produk is van 'n verlore HTML-era.
Hierdie artikel is vir die begin van webontwikkelaars wat waarskynlik nuut is vir HTML en CSS. Dit sal u help om te leer hoe om die HTML-tag en CSS te gebruik om die kleur van spesifieke teks op u bladsye te verander. Daar word gesê dat daar 'n paar nadele is aan hierdie metode wat ek aan die einde van hierdie artikel sal dek. Lees nou eers die stappe om hierdie teks kleur te verander! Dit is baie maklik en moet ongeveer 2 minute duur.
Stap vir stap instruksie
- Open die webblad wat jy wil bywerk in jou gunsteling HTML-redakteur. Dit kan 'n program soos Adobe Dreamweaver of 'n eenvoudig teksredakteur wees soos Notepad, Notepad + +, TextEdit, ens.
- In die dokument, soek die woorde wat jy in 'n ander kleur op die bladsy wil vertoon. Ter wille van hierdie handleiding kan ons 'n paar woorde gebruik wat binne 'n groter paragraaf van die teks voorkom. Daardie teks sal binne-in-die-paartjie voorkom. Vind een van twee woorde waarvan u die kleur wil wysig.
- Plaas jou wyser voor die eerste letter in die woord of groep woorde wat jy wil verander. Onthou, as jy 'n WYSIWYG- redakteur soos Dreamweaver gebruik, werk jy nou in die "code view" rigth.
- Laat die teks wikkel waarvan ons wil verander met 'n merker, insluitend 'n klasattribuut. Die hele paragraaf kan soos volg lyk: Hierdie is teks wat in 'n sin gefokus is.
- Ons het net 'n inlyn-element, die, gebruik om daardie spesifieke teks 'n "haak" te gee wat ons in CSS kan gebruik. Ons volgende stap is om na ons eksterne CSS-lêer te spring om 'n nuwe reël by te voeg.
- In ons CSS-lêer, kom ons by:
- .fokus-teks {
- kleur: # F00;
- }
- Hierdie reël stel die inlyn-element, die, in om die rooi kleur te vertoon. As ons 'n vorige styl gehad het wat die teks van ons dokument swart gestel het, sal hierdie inlyn-styl veroorsaak dat die spantekst daarop gefokus word en met die verskillende kleur uitstaan. Ons kan ook ander style by hierdie reël voeg, miskien maak die teks kursief of vet om dit nog meer te beklemtoon?
- Stoor jou bladsy.
- Toets die bladsy in jou gunsteling webblaaier om die veranderinge in werking te sien.
- Let daarop dat, bykomend tot die, sommige webpersoneel kies om ander elemente soos die of merkerpare te gebruik. Hierdie etikette was spesifiek vir "vet" en "kursief", maar was afgekeur en vervang met en. Die etikette werk nog steeds in moderne blaaiers, maar so baie webontwikkelaars gebruik dit as inline-stilkoppe. Dit is nie die ergste benadering nie, maar as jy enige verouderde elemente wil vermy, stel ek voor dat jy met die merker vir hierdie soort stileringsbehoeftes hou.
Wenke en dinge om uit te kyk
Alhoewel hierdie benadering goed werk vir klein stileringsbehoeftes, soos om net een klein stuk teks in 'n dokument te verander, kan dit vinnig buite beheer wees. As jy vind dat jou bladsy vol inline-elemente is, wat almal unieke klasse bevat wat jy in jou CSS-lêer gebruik, kan jy dit verkeerd doen. Onthou, hoe meer van hierdie etikette in jou bladsy is, hoe moeiliker sal waarskynlik wees om daardie bladsy na vore te hou. Daarbenewens het goeie webtypografie selde soveel variasies van kleur, ens. Regdeur die bladsy!