A CSS segítségével egyszerűen beállíthatja a szöveg színét egy dokumentumban. Ha azt szeretné, hogy az oldalon szereplő bekezdések bizonyos színnel jelenjenek meg, akkor egyszerűen adja meg azt a külső stíluslapon, és a böngésző megjeleníti a kiválasztott színt. Mi történik akkor, ha csak egy szó színét szeretné megváltoztatni (vagy talán csak néhány szót) egy szövegrészen belül? Ehhez olyan inline elemet kell használnia, mint a címke.
Végső soron egyetlen szó vagy kis mondat színének megváltoztatása egy mondaton belül könnyű a CSS használatával, és a címkék érvényesek HTML-nek, ezért ne aggódj, hogy ez valamilyen hack. Ezzel a megközelítéssel elkerülheti az elavult címkék és attribútumok használatát is, mint például a "betűtípus", amely a régi HTML-korszak terméke.
Ez a cikk azoknak a webfejlesztőknek a kezdetéhez szól, akik valószínűleg újak a HTML és a CSS számára. Segít megismerni a HTML-címke és a CSS használatát, hogy megváltoztassa az oldalakon megjelenő konkrét szöveg színét. Mindezek ellenére vannak hátrányai ennek a módszernek, amelyet e cikk végén fogok lefedni. Most olvasd el a szöveg színének megváltoztatásához szükséges lépéseket! Nagyon könnyű és körülbelül 2 percet vesz igénybe.
Lépésről lépésre
- Nyissa meg a frissíteni kívánt weboldalt kedvenc szöveges HTML-szerkesztőjében. Ez lehet egy olyan program, mint az Adobe Dreamweaver vagy egy egyszerű szövegszerkesztő, például Notepad, Notepad ++, TextEdit stb.
- A dokumentumban keresse meg azokat a szavakat, amelyeket meg szeretne jeleníteni az oldalon egy másik színnel. A bemutató kedvéért használjon olyan szavakat, amelyek egy nagyobb szövegrészen belül vannak. Ezt a szöveget a tagpár tartalmazza. Keressen egy olyan két szót, amelynek színeit szerkeszteni szeretné.
- Helyezze a kurzort az első betű előtt a szavak vagy szavak csoportjába, hogy színt változtasson. Ne feledje, ha WYSIWYG- szerkesztőt használ, mint a Dreamweaver, akkor most "kódnézetben" dolgozik.
- Hagyja át a szöveget, amelynek színét meg akarjuk változtatni egy címkével, beleértve egy osztály attribútumot. Az egész bekezdés így néz ki: Ez egy olyan szöveg, amely egy mondatban áll.
- Épp most használtunk egy inline elemet, a, hogy adott szöveget egy "horog", hogy tudjuk használni a CSS. Következő lépésünk az, hogy ugorjunk a külső CSS-fájlunkra egy új szabály hozzáadásához.
- A CSS-fájlunkban adjuk hozzá:
- .focus-text {
- szín: # F00;
- }
- Ez a szabály határozza meg, hogy az inline elem, a, hogy megjelenjen a szín piros. Ha korábban olyan stílusunk volt, amely dokumentumunk szövegét fekete színre állította, akkor ez a beágyazott stílus okozná a span szövegének a különböző színű megjelenítését és kiemelését. Ehhez a szabályhoz más stílusokat is felvehetnénk, talán a szöveg dőlt betűkkel vagy merészebbé válva még inkább hangsúlyozni.
- Az oldal mentése.
- Vizsgálja meg az oldalt a kedvenc böngészőjében, hogy megtekinthesse a hatályos változásokat.
- Ne feledje, hogy a weboldal mellett a webes szakemberek olyan elemeket is választanak, mint a vagy a címkepárok. Ezek a címkék kifejezetten a "félkövér" és a "dőlt" kifejezésekre vonatkoztak, de elavulták és helyettesítették. A címkék még mindig működnek a modern böngészőkben, azonban sok webfejlesztő használja őket inline styling kampóként. Ez nem a legrosszabb megközelítés, de ha el kívánja kerülni az elavult elemek elkerülését, azt javaslom, hogy ragaszkodj a címkéhez az ilyen típusú igényekhez.
Tippek és dolgok, amelyekre figyelni kell
Bár ez a megközelítés jól működik a kis formázási igényekhez hasonlóan, például ha egy dokumentumban csak egy kis szöveget kell megváltoztatni, akkor gyorsan ki tud lépni az irányításból. Ha úgy találja, hogy oldala beágyazott elemekkel van elrejtve, amelyek mindegyikének egyedi osztályai vannak a CSS-fájlban, akkor rosszul csináljátok. Ne feledje, hogy ezeknek a címkéknek a többsége az oldalon van, annál nehezebb valószínűleg az oldal fenntartása lesz. Továbbá, a jó webes tipográfia ritkán van olyan színes variációkban, stb. Az egész oldalon!