Arbeta med typsnitt och typsnittsegenskaper
Svep för att visa menyn
Typsnitt har stor inverkan på tonen och läsbarheten på en webbsida.
I detta kapitel behandlas de mest använda typsnittsrelaterade CSS-egenskaperna: font-family, font-size, font-weight och font-style.
Alla exempel använder samma text för att visa hur dessa egenskaper påverkar utseendet.
font-family
Egenskapen font-family anger vilket typsnitt som används för att visa text.
p {
font-family: 'Montserrat', Arial, sans-serif;
}
Flera typsnitt kan anges som reserv, separerade med kommatecken. Om det första typsnittet inte är tillgängligt används nästa i listan. Det rekommenderas att alltid inkludera en generell reserv som: serif, sans-serif, monospace.
font-size
Egenskapen font-size styr hur stor texten visas.
p {
font-size: 16px;
}
Vanliga enheter:
px: fast storlek;em: relativt till överordnat element;rem: relativt till rot-elementet.
font-weight
Styr tjockleken på texten. 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å det 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
styles.css
font-family definierar typsnitt och reservtypsnitt.
font-size styr textstorlek i px, em eller rem.
font-weight justerar tjocklek med siffror eller nyckelord.
font-style ändrar teckensnittsstil.
::first-letter formaterar 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?
Tack för dina kommentarer!
Fråga AI
Fråga AI
Fråga vad du vill eller prova någon av de föreslagna frågorna för att starta vårt samtal
Arbeta med typsnitt och typsnittsegenskaper
Typsnitt har stor inverkan på tonen och läsbarheten på en webbsida.
I detta kapitel behandlas de mest använda typsnittsrelaterade CSS-egenskaperna: font-family, font-size, font-weight och font-style.
Alla exempel använder samma text för att visa hur dessa egenskaper påverkar utseendet.
font-family
Egenskapen font-family anger vilket typsnitt som används för att visa text.
p {
font-family: 'Montserrat', Arial, sans-serif;
}
Flera typsnitt kan anges som reserv, separerade med kommatecken. Om det första typsnittet inte är tillgängligt används nästa i listan. Det rekommenderas att alltid inkludera en generell reserv som: serif, sans-serif, monospace.
font-size
Egenskapen font-size styr hur stor texten visas.
p {
font-size: 16px;
}
Vanliga enheter:
px: fast storlek;em: relativt till överordnat element;rem: relativt till rot-elementet.
font-weight
Styr tjockleken på texten. 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å det 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
styles.css
font-family definierar typsnitt och reservtypsnitt.
font-size styr textstorlek i px, em eller rem.
font-weight justerar tjocklek med siffror eller nyckelord.
font-style ändrar teckensnittsstil.
::first-letter formaterar första bokstaven i en textblock.
Tack för dina kommentarer!
