CSS- iga on dokumendi värvi lihtne määrata. Kui soovite, et teie lehe lõiked oleksid teatud kujul kujundatud, märkige lihtsalt, et oma välise laadilehega ja brauser kuvab teie valitud valitud värvi teksti. Mis siis juhtub siis, kui soovite muuta ühe sõna (või mõne sõna) värvi ainult teksti lõigus? Selleks peate kasutama sisseehitatud elementi nagu silt.
Lõppkokkuvõttes on ühe sõna või väikese rühma sõnade muutmine lauses lihtne kasutades CSS-i ja sildid on kehtiv HTML-kood, nii et ärge muretsege, et see on mingi häkkimine. Selle lähenemisviisiga väldite ka vananenud silte ja atribuutide kasutamist nagu "font", mis on HTML-ajastu aeg.
See artikkel on mõeldud veebiarendajatele, kes on tõenäoliselt uued HTML-i ja CSS-i jaoks. See aitab teil õppida HTML-märgendi ja CSS-i kasutamist konkreetse teksti värvi muutmiseks teie lehtedel. Seda öeldes on selle meetodi puhul mõningaid puudusi, mida ma selle artikli lõpus käsitlema. Nüüd saate lugeda seda teksti värvi muutmise sammudest! See on väga lihtne ja peaks võtma umbes 2 minutit.
Samm-sammult juhis
- Avage oma lemmikteksti HTML-redaktori veebileht, mida soovite värskendada. See võib olla selline programm nagu Adobe Dreamweaver või lihtsalt tekstitöötlus nagu Notepad, Notepad ++, TextEdit jne.
- Leidke dokumendis sõnad, mida soovite kuvada lehel erineval värvil. Selle õpetuse huvides võite kasutada mõnda sõna, mis on teksti suuremas osas. See tekst sisaldub thetag paaris. Leidke üks kahest sõnast, mille värvi soovite muuta.
- Asetage kursor enne sõna või sõna gruppi, kuhu soovite värvi muuta, esimese tähega. Pidage meeles, et kui kasutate WYSIWYG- redaktorit nagu Dreamweaver, siis töötate nüüd "koodi vaate" seadistuses.
- Lase teksti kaust, mille värvi tahame sildiga muuta, sealhulgas klassi atribuut. Kogu lõik võib olla selline: see on tekst, mis keskendub lauses.
- Oleme just kasutanud sisseehitatud elementi, mis annab selle konkreetse teksti "konksu", mida saame CSSis kasutada. Meie järgmine samm on uue reegli lisamiseks meie välisele CSS-failile hüpata.
- Meie CSS-failis lisame:
- .focus-text {
- värv: # F00;
- }
- The
- See reegel määrab, et sisemine element, punane kuvatakse punasena. Kui meil oli varasem stiil, mis määrab meie dokumendi teksti mustale, muudab see sisemine stiil span-teksti keskenduks ja eristub erinevate värvidega. Võiksime ka selle reegli juurde lisada teisi stiile, ehk tehes selle teksti paksu tekstiga või julgeks rõhutada seda veelgi rohkem?
- Salvesta oma leht.
- Kontrollige oma lemmikveebibrauseris olevat lehte , et näha kehtivad muudatused.
- Pange tähele, et lisaks mõnede veebi spetsialistide otsustada kasutada muid elemente, näiteks või tag paarid. Need märgendid olid spetsiaalselt "rasvased" ja "kaldkirjad", kuid need olid vananenud ja asendatud ja. Sildid töötavad tänapäevastes brauserites, kuid paljud veebiarendajad kasutavad neid kui sisemist stiilkonksu. See ei ole halvim lähenemine, kuid kui soovite vältida vananenud elemente, siis soovitan kinni sellist tüüpi stiili vajadusest.
Näpunäiteid ja asju, mida tuleb hoolitseda
Kuigi see lähenemine sobib hästi väikeste kujundamisvajadustega, nagu näiteks, kui peate dokumendis vahetama ainult ühte väikest teksti, võib see kiiresti kontrolli saamisest välja. Kui leiad, et teie leht on seesmiste elementidega täidetud, kõikidel neist on unikaalsed klassid, mida kasutate oma CSS-failis, siis võite seda teha valesti. Pea meeles, et rohkem neid sildid on teie lehel, seda raskem see on tõenäoliselt selle lehe jätkamine. Lisaks sellele on hea veebitrükograafia harva nii palju värve ja muid võimalusi kogu lehes!