Förståelse och Användning av Typsnittsegenskaper
Låt oss titta på de vanligaste egenskaperna relaterade till 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 */
}
Observera
Alla exempel kommer att demonstreras med samma textinnehåll för att ge möjlighet att se hur samma text kan visas på olika sätt.
font-family
Egenskapen font-family definierar den eller de typsnittsfamiljer som används för att visa textinnehåll. Det är möjligt att ange ett enskilt typsnittsnamn eller en lista med flera typsnittsnamn separerade med kommatecken.
font-size
Egenskapen font-size anger teckenstorleken för att visa textinnehåll. Den kan vara en fast storlek mätt i px eller en relativ storlek mätt i enheter som em eller rem.
font-weight
Egenskapen font-weight bestämmer tjockleken eller vikten på teckensnittet som används för att visa textinnehåll. Den kan anges som ett numeriskt värde (t.ex. 300, 500, 700, ...) eller som ett nyckelord (t.ex. lighter, normal eller bold).
font-style
Egenskapen font-style specificerar stilen på teckensnittet som ska användas för textinnehåll. Detta kan vara normal (standardvärde), italic eller oblique.
Pseudoklass ::first-letter
Pseudoklassen first-letter väljer och formaterar det första bokstaven i ett stycke eller en rubrik. För att använda denna pseudoklass, placera dubbla :: efter en selektor och lägg till nyckelordet first-letter.
selector::first-letter {
/* some styles */
}
Kör nästa exempel för att se hur det fungerar.
index.html
styles.css
Sammanfattning
font-familyanger typsnitt eller reservtypsnitt för text. Flera typsnitt kan listas för att säkerställa korrekt återgivning;font-sizedefinierar textstorlek med absoluta enheter (px) eller relativa enheter (em, rem);font-weightstyr typsnittets tjocklek, antingen numeriskt (100–900) eller med nyckelord somnormalellerbold;font-stylebestämmer typsnittets stil, såsomnormal,italicelleroblique;- Pseudoklassen
::first-letterriktar in sig på och formaterar det första bokstaven i ett textblock, vilket möjliggör kreativa typografiska effekter.
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
Awesome!
Completion rate improved to 2.56Förståelse och Användning av Typsnittsegenskaper
Svep för att visa menyn
Låt oss titta på de vanligaste egenskaperna relaterade till 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 */
}
Observera
Alla exempel kommer att demonstreras med samma textinnehåll för att ge möjlighet att se hur samma text kan visas på olika sätt.
font-family
Egenskapen font-family definierar den eller de typsnittsfamiljer som används för att visa textinnehåll. Det är möjligt att ange ett enskilt typsnittsnamn eller en lista med flera typsnittsnamn separerade med kommatecken.
font-size
Egenskapen font-size anger teckenstorleken för att visa textinnehåll. Den kan vara en fast storlek mätt i px eller en relativ storlek mätt i enheter som em eller rem.
font-weight
Egenskapen font-weight bestämmer tjockleken eller vikten på teckensnittet som används för att visa textinnehåll. Den kan anges som ett numeriskt värde (t.ex. 300, 500, 700, ...) eller som ett nyckelord (t.ex. lighter, normal eller bold).
font-style
Egenskapen font-style specificerar stilen på teckensnittet som ska användas för textinnehåll. Detta kan vara normal (standardvärde), italic eller oblique.
Pseudoklass ::first-letter
Pseudoklassen first-letter väljer och formaterar det första bokstaven i ett stycke eller en rubrik. För att använda denna pseudoklass, placera dubbla :: efter en selektor och lägg till nyckelordet first-letter.
selector::first-letter {
/* some styles */
}
Kör nästa exempel för att se hur det fungerar.
index.html
styles.css
Sammanfattning
font-familyanger typsnitt eller reservtypsnitt för text. Flera typsnitt kan listas för att säkerställa korrekt återgivning;font-sizedefinierar textstorlek med absoluta enheter (px) eller relativa enheter (em, rem);font-weightstyr typsnittets tjocklek, antingen numeriskt (100–900) eller med nyckelord somnormalellerbold;font-stylebestämmer typsnittets stil, såsomnormal,italicelleroblique;- Pseudoklassen
::first-letterriktar in sig på och formaterar det första bokstaven i ett textblock, vilket möjliggör kreativa typografiska effekter.
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!
