Skip to main content

Så här ändrar du webbsidor med CSS

Gifs With Sound #228 (April 2025)

Gifs With Sound #228 (April 2025)
Anonim

Enkla stylingalternativ kan du ändra en webbsides typsnitt (eller typ) med hjälp av CSS (Cascading Style Sheets). Du kan ställa in teckensnittet för enskilda ord, specifika meningar, rubriker, hela stycken och till och med hela sidor av text.

Så här byter du teckensnitt med CSS

Du kan göra HTML- och CSS-ändringar som förklaras nedan med hjälp av en HTML-redigerare eller textredigerare. Du kan antingen kopiera texten från sidan och klistra in den i en redigerare för att göra ändringarna där eller öppna hela webbsidan i redigeraren och redigera direkt.

  1. Leta reda på texten där du vill ändra teckensnittet. Vi använder detta som ett exempel:

    Denna text finns i Arial

  2. Omslut texten med SPAN-elementet:

    Denna text finns i Arial

  3. Lägg till attributet style = "" till span-taggen:

    Denna text finns i Arial

  4. Inom stilattributet, ändra teckensnittet med hjälp av typsnittsfamilj stil.

    Denna text finns i Arial

  5. Spara ändringarna för att se effekterna.

Tips för att använda CSS för att ändra teckensnitt

  1. Det bästa sättet är att alltid ha minst två teckensnitt i din typsnittstapel (listan med teckensnitt), så att om webbläsaren inte har den första teckensnittet, kan den använda det andra teckensnittet istället.

    Separera flera teckensnitt med ett komma, så här:

    font-family: Arial, Genève, Helvetica, sans-serif;

  2. Exemplet som beskrivs ovan använder inline styling, men den bästa typen av styling använder ett externt stilark så att du kan påverka mer än bara ett element. Du kan använda en klass för att ställa in stilen på textblock.

    Denna text finns i Arial

    I det här exemplet kommer CSS-filen att ställa in ovanstående HTML att visas enligt följande:

    .arial {font-family: Arial; }

  3. Avsluta alltid CSS-format med en semikolon (;). Det krävs inte när det bara finns en stil, men det är en bra vana att börja.