Συντομογραφία γραμματοσειράς CSS

Πίνακας περιεχομένων

Η ιδιότητα γραμματοσειράς CSS

Για να συντομεύσετε τον κώδικα, είναι επίσης δυνατό να καθορίσετε όλες τις μεμονωμένες ιδιότητες γραμματοσειράς σε μία ιδιότητα.

Η ιδιότητα font είναι μια συντομογραφία για:

font-style
font-variant
font-weight
font-size/line-height
font-family

Σημείωση: Το μέγεθος γραμματοσειράς και το font-family απαιτούνται τιμές. Εάν λείπει μία από τις άλλες τιμές, χρησιμοποιείται η προεπιλεγμένη τιμή τους.

Παράδειγμα

Χρησιμοποιήστε font για να ορίσετε πολλές ιδιότητες γραμματοσειράς σε μια δήλωση:

   p.a
 {
     
 font: 20px Arial, sans-serif;
 }
 
 p.b
 {
     
 font: italic small-caps bold 12px/30px Georgia, serif;
 }

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<head>
<style>
p.a {
  font: 20px Arial, sans-serif;
}

p.b {
  font: italic small-caps bold 12px/30px Georgia, serif;
}
</style>
</head>
<body>

<h1>The font Property</h1>

<p class="a">This is a paragraph. The font size is set to 20 pixels, and the font family is Arial.</p>

<p class="b">This is a paragraph. The font is set to italic, small-caps and bold, the font size is set to 12 pixels, the line height is set to 30 pixels, and the font family is Georgia.</p>

</body>
</html>

Όλες οι ιδιότητες γραμματοσειράς CSS

font: Ορίζει όλες τις ιδιότητες γραμματοσειράς σε μία δήλωση
font-family: Καθορίζει την οικογένεια γραμματοσειρών για κείμενο
font-size: Καθορίζει το μέγεθος γραμματοσειράς του κειμένου
font-style: Καθορίζει το στυλ γραμματοσειράς για το κείμενο
font-variant: Καθορίζει εάν ένα κείμενο θα πρέπει να εμφανίζεται ή όχι με γραμματοσειρά με μικρά κεφαλαία
font-weight: Καθορίζει το βάρος μιας γραμματοσειράς