Promijenite boju riječi pomoću SPAN oznake u CSS-u

click fraud protection

Možete odrediti boje, veličine i druge parametre fonta u vanjskoj CSS tablici stilova. Ako pak želite promijeniti boju samo jedne riječi ili fraze, najlakši i najjednostavniji način je upotrijebiti oznaku. Inline CSS upravo tako zvuči: dodaje se u HTML stranice, umjesto u vanjski tablicu stilova.

Izbjegavajte upotrebu oznake koja je zastarjela.

Evo kako promijeniti boju riječi pomoću oznake:

  1. Pomoću željenog uređivača teksta ili HTML-a u načinu prikaza koda postavite pokazivač ispred prvog slova riječi ili skupine riječi koju želite obojiti.

  2. Omotajmo tekst čiju boju želimo promijeniti oznakom, uključujući atribut klase. Cijeli odlomak može izgledati ovako: Ovo je tekst na koji se fokusira rečenica.

  3. Dajte tom specifičnom tekstu "udicu" koju možemo koristiti u CSS-u. Sljedeći je korak prijeći na našu vanjsku CSS datoteku kako bismo dodali novo pravilo.

    U našu CSS datoteku dodajmo:

    .focus-text {

     boja: # F00;

    }

    Ovo bi pravilo postavilo taj unutarnji element, da se prikazuje u crvenoj boji. Da imamo prethodni stil koji je tekst našeg dokumenta postavljao u crno, ovaj bi umetnuti stil usmjerio fokus na raspon i isticao se drugom bojom. Ovom bismo pravilu mogli dodati i druge stilove, možda čineći tekst kurzivom ili podebljanim kako bismo ga još više naglasili?

    instagram viewer

  4. Spremite svoju stranicu.

    Testirajte stranicu u svom omiljenom web pregledniku da biste vidjeli promjene na snazi.

    Imajte na umu da se osim, neki web stručnjaci odlučuju koristiti i druge elemente poput parova ili tag. Te su oznake nekad bile podebljane i kurziv, ali su zastarjele i zamijenjene s i. Oznake i dalje rade u modernim preglednicima, međutim, mnogi ih web programeri koriste kao umetnute kukice za oblikovanje. Ovo nije najgori pristup, ali ako želite izbjeći zastarjele elemente, predlažemo da se pridržavate oznake za ove vrste stilskih potreba.

Savjeti i na što treba paziti

Iako ovaj pristup dobro funkcionira za male potrebe oblikovanja, na primjer, ako trebate promijeniti samo jedan mali dio teksta u dokumentu, brzo može izmaći kontroli. Ako utvrdite da je vaša stranica prepuna umetnutih elemenata, od kojih svi imaju jedinstvene klase koje koristite u CSS datoteci, možete činite to pogrešno, sjetite se, što je više ovih oznaka na vašoj stranici, to će vjerojatno biti teže održavati tu stranicu naprijed. Uz to, dobra web tipografija rijetko ima toliko varijanti boja itd. na cijeloj stranici.

instagram story viewer