Proprietatea prescurtată CSS font
Pentru a scurta codul, poți seta toate proprietățile fontului într-o singură declarație.
Proprietatea font este o prescurtare pentru: font-style, font-variant, font-weight, font-stretch, font-size, line-height și font-family.
Reguli pentru proprietatea prescurtată CSS font
- Valorile
font-sizeșifont-familysunt obligatorii. Dacă o altă valoare lipsește, se folosește valoarea implicită. - Dacă sunt setate,
font-style,font-variantșifont-weighttrebuie să apară înainteafont-size. - Dacă este setată,
line-heighttrebuie să apară imediat dupăfont-size, separată printr-o linie oblică, precum15px/30px. font-familytrebuie să fie ultima valoare.
Exemplu
Trei paragrafe setează mai multe proprietăți ale fontului deodată, folosind prescurtarea font.
Prompt
O pagină HTML care folosește proprietatea prescurtată font.
Într-un bloc intern
<style>, creează trei clase de paragraf: a cu "20px Arial, sans-serif"; b cu "italic bold 16px Arial, sans-serif"; și c cu "italic small-caps bold 15px/30px Georgia, serif". Adaugă un paragraf pentru fiecare clasă.
Rezultat: pagină HTML completă
index.html
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
p.a {
font: 20px Arial, sans-serif;
}
p.b {
font: italic bold 16px Arial, sans-serif;
}
p.c {
font: italic small-caps bold 15px/30px Georgia, serif;
}
</style>
</head>
<body>
<p class="a">A paragraph using font: 20px Arial.</p>
<p class="b">A paragraph using font: italic bold 16px Arial.</p>
<p class="c">A paragraph using font: italic small-caps bold 15px/30px Georgia.</p>
</body>
</html>
Toate proprietățile CSS ale fontului
Un rezumat al proprietăților fontului:
font— setează toate proprietățile fontului într-o singură declarație.font-family— setează familia de fonturi.font-size— setează dimensiunea fontului.font-style— setează stilul fontului.font-variant— setează dacă textul folosește un font small-caps.font-weight— setează grosimea fontului.