Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Lära Förståelse och användning av typsnittsegenskaper | Formatera Text i CSS
CSS-Grunder

bookFörståelse och användning av typsnittsegenskaper

Här är de vanligaste CSS-egenskaperna som används för att styla typsnitt:

selector {
  font-family: 'Montserrat' | 'Oswald' | 'Lato' |...; /* any font family */
  font-size: 12px | 0.5em | 0.8rem |...; /* it can be any value in px/em/rem units */
  font-weight: 400 | 500 | 700 | 900 |...; /* value 100 - 900 */
  font-style: normal | italic | oblique; /* only these values available */
}
Note
Observera

Alla exempel använder samma text för att visa hur dessa egenskaper ändrar utseendet.

font-family

Definierar det typsnitt som används för att visa text. Det går att ange ett typsnitt eller en lista med reservtypsnitt separerade med kommatecken.

font-size

Styr textens storlek. px: fast storlek. em/rem: storlek relativt till föräldra- eller rotnoden.

font-weight

Styr textens tjocklek. Numeriska värden: 100–900. Nyckelord: normal, bold, lighter.

font-style

Anger textens stil: normal, italic eller oblique.

Pseudoklass ::first-letter

::first-letter riktar in sig på den första bokstaven i ett element (vanligtvis ett stycke eller en rubrik), vilket möjliggör dekorativa eller stiliserade effekter.

selector::first-letter {
 /* some styles */
}

Låt oss köra nästa exempel för att se hur det fungerar.

index.html

index.html

styles.css

styles.css

copy
Note
Sammanfattning

font-family anger typsnitt och reservtypsnitt.

font-size styr textstorleken i px, em eller rem.

font-weight justerar tjockleken med siffror eller nyckelord.

font-style ändrar teckensnittsstilen.

::first-letter formaterar den första bokstaven i en textblock.

1. Vilken egenskap bestämmer tjockleken på teckensnittet?

2. Vad är standardvärdet för egenskapen font-style i CSS?

question mark

Vilken egenskap bestämmer tjockleken på teckensnittet?

Select the correct answer

question mark

Vad är standardvärdet för egenskapen font-style i CSS?

Select the correct answer

Var allt tydligt?

Hur kan vi förbättra det?

Tack för dina kommentarer!

Avsnitt 2. Kapitel 5

Fråga AI

expand

Fråga AI

ChatGPT

Fråga vad du vill eller prova någon av de föreslagna frågorna för att starta vårt samtal

bookFörståelse och användning av typsnittsegenskaper

Svep för att visa menyn

Här är de vanligaste CSS-egenskaperna som används för att styla typsnitt:

selector {
  font-family: 'Montserrat' | 'Oswald' | 'Lato' |...; /* any font family */
  font-size: 12px | 0.5em | 0.8rem |...; /* it can be any value in px/em/rem units */
  font-weight: 400 | 500 | 700 | 900 |...; /* value 100 - 900 */
  font-style: normal | italic | oblique; /* only these values available */
}
Note
Observera

Alla exempel använder samma text för att visa hur dessa egenskaper ändrar utseendet.

font-family

Definierar det typsnitt som används för att visa text. Det går att ange ett typsnitt eller en lista med reservtypsnitt separerade med kommatecken.

font-size

Styr textens storlek. px: fast storlek. em/rem: storlek relativt till föräldra- eller rotnoden.

font-weight

Styr textens tjocklek. Numeriska värden: 100–900. Nyckelord: normal, bold, lighter.

font-style

Anger textens stil: normal, italic eller oblique.

Pseudoklass ::first-letter

::first-letter riktar in sig på den första bokstaven i ett element (vanligtvis ett stycke eller en rubrik), vilket möjliggör dekorativa eller stiliserade effekter.

selector::first-letter {
 /* some styles */
}

Låt oss köra nästa exempel för att se hur det fungerar.

index.html

index.html

styles.css

styles.css

copy
Note
Sammanfattning

font-family anger typsnitt och reservtypsnitt.

font-size styr textstorleken i px, em eller rem.

font-weight justerar tjockleken med siffror eller nyckelord.

font-style ändrar teckensnittsstilen.

::first-letter formaterar den första bokstaven i en textblock.

1. Vilken egenskap bestämmer tjockleken på teckensnittet?

2. Vad är standardvärdet för egenskapen font-style i CSS?

question mark

Vilken egenskap bestämmer tjockleken på teckensnittet?

Select the correct answer

question mark

Vad är standardvärdet för egenskapen font-style i CSS?

Select the correct answer

Var allt tydligt?

Hur kan vi förbättra det?

Tack för dina kommentarer!

Avsnitt 2. Kapitel 5
some-alt