Jak używać CSS do zmiany czcionek na stronach internetowych

Ustaw czcionkę dla określonych słów, akapitów lub całych stron internetowych

Proste opcje stylów umożliwiają zmianę czcionki strony internetowej za pomocą kaskadowych arkuszy stylów. Użyj CSS, aby ustawić czcionkę pojedynczych słów, określonych zdań, nagłówków, całych akapitów, a nawet całych stron tekstu.

Poniższe zrzuty ekranu odnoszą się do placu zabaw kodu JSFiddle.net, ale opisane koncepcje są prawdziwe bez względu na to, gdzie kod jest zaimplementowany.

Derek Abella / Lifewire

Jak zmienić czcionkę za pomocą CSS

Zrób HTML i zmiany CSS wyjaśnione poniżej przy użyciu dowolnego edytora HTML lub edytora tekstu.

1. Znajdź tekst, w którym chcesz zmienić czcionkę. Użyjemy tego jako przykładu:

   
   
   |_+_|

2. Otocz tekst elementem SPAN:

   |_+_|

3. Dodaj atrybut > do tagu span:

   |_+_|

4. W atrybucie stylu zmień czcionkę za pomocą rodzina czcionek styl.

   |_+_|

   Jona Fishera

   
   
   

5. Zapisz zmiany, aby zobaczyć efekty.

Wskazówki dotyczące używania CSS do zmiany czcionki

1. Najlepszym podejściem jest zawsze mieć co najmniej dwie czcionki w swoim stos czcionek (lista czcionek), więc jeśli przeglądarka nie ma pierwszej czcionki, może zamiast niej użyć drugiej czcionki.

   
   
   

   Oddziel wiele wybranych czcionek przecinkiem, w ten sposób:

   |_+_|

2. W powyższym przykładzie zastosowano stylizację inline, ale najlepiej rodzaj stylizacji używa an zewnętrzny arkusz stylów modyfikować więcej niż tylko jeden element. Użyj klasy, aby ustawić styl na blokach tekstu.

   
   
   |_+_|

   Ten tekst jest w Arial

   W tym przykładzie plik CSS stylizujący powyższy kod HTML wyglądałby następująco:

   |_+_|

   Jon Fisher

   
   
   

3. Zawsze kończ style CSS średnikiem (;). Nie jest to wymagane, gdy istnieje tylko jeden styl, ale to dobry nawyk na początek.