Skip to main content

Szó színének módosítása a SPAN címkével a CSS-ben

Toddler Words | Words starting with A (Április 2025)

Toddler Words | Words starting with A (Április 2025)
Anonim

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 lefedünk. 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 két percet vesz igénybe.

Lépésről lépésre

  1. 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.
  2. A dokumentumban keresse meg azokat a szavakat, amelyeket meg szeretne jeleníteni az oldalon egy másik színnel. A bemutató kedvéért használjunk olyan szavakat, amelyek egy nagyobb szövegrészen belül vannak. Ez a szöveg a címkepáron belül lesz. Keressen egy olyan két szót, amelynek színeit szerkeszteni szeretné.
  3. 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.
  4. 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 szöveg, amely egy mondatra koncentrál.

  5. É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.
  1. A CSS-fájlunkban adjuk hozzá:
  2. .focus-text {

  3. szín: # F00;

  4. }

  5. 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.
  6. Az oldal mentése.
  7. Vizsgálja meg az oldalt a kedvenc böngészőjében, hogy megtekinthesse a hatályos változásokat.
  8. 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 merész és dőlt betűkként használatosak voltak, de elavulták és helyettesítik őket. 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 elemeket, javasoljuk, hogy ragaszkodjon 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, ha csak egy kis szövegdarabot kell módosítani egy dokumentumban, akkor gyorsan elszabadulhat. 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 változatokban, stb. Az egész oldalon.