Βάρος γραμματοσειράς - CSS-Κόλπα

Anonim

Η font-weightιδιότητα ορίζει το βάρος ή το πάχος μιας γραμματοσειράς και εξαρτάται είτε από τα διαθέσιμα πρόσωπα γραμματοσειρών σε μια οικογένεια γραμματοσειρών είτε από βάρη που ορίζονται από το πρόγραμμα περιήγησης.

span ( font-weight: bold; )

Η font-weightιδιότητα δέχεται είτε μια λέξη-κλειδί είτε μια προκαθορισμένη αριθμητική τιμή. Οι διαθέσιμες λέξεις-κλειδιά είναι:

  • normal
  • bold
  • bolder
  • lighter

Οι διαθέσιμες αριθμητικές τιμές είναι:

  • 100
  • 200
  • 300
  • 400
  • 500
  • 600
  • 700
  • 800
  • 900

Η τιμή της λέξης-κλειδιού normalαντιστοιχεί στην αριθμητική τιμή 400και η τιμή boldαντιστοιχεί στο 700.

Για να δείτε οποιοδήποτε αποτέλεσμα χρησιμοποιώντας τιμές διαφορετικές από 400ή 700, η γραμματοσειρά που χρησιμοποιείται πρέπει να έχει ενσωματωμένες όψεις που ταιριάζουν με αυτά τα καθορισμένα βάρη.

Εάν μια γραμματοσειρά έχει έντονη ("700") ή κανονική ("400") έκδοση ως μέρος της οικογένειας γραμματοσειρών, το πρόγραμμα περιήγησης θα το χρησιμοποιήσει. Εάν αυτά δεν είναι διαθέσιμα, το πρόγραμμα περιήγησης θα μιμείται τη δική του τολμηρή ή κανονική έκδοση της γραμματοσειράς. Δεν μιμείται τα άλλα μη διαθέσιμα βάρη. Οι γραμματοσειρές συχνά χρησιμοποιούν ονόματα όπως "Κανονικό" και "Φως" για να προσδιορίσουν τυχόν εναλλακτικά βάρη γραμματοσειρών.

Η παρακάτω επίδειξη δείχνει τη χρήση των εναλλακτικών τιμών βάρους:

Δείτε αυτό το στυλό!

Η παραπάνω επίδειξη χρησιμοποιεί τη δωρεάν γραμματοσειρά Open Sans, ενσωματωμένη χρησιμοποιώντας το Google Web Fonts API. Η γραμματοσειρά φορτώνεται με όλα τα διαθέσιμα βάρη γραμματοσειρών και έτσι, χρησιμοποιώντας την font-weightιδιότητα, εμφανίζονται τα διαφορετικά διαθέσιμα βάρη όπως περιγράφεται από το κείμενο κάθε παραγράφου. Τα μη διαθέσιμα βάρη εμφανίζουν απλώς το λογικά πιο κοντινό βάρος.

Οι κοινές γραμματοσειρές όπως η Arial, η Helvetica, η Γεωργία κ.λπ. δεν έχουν βάρη εκτός από 400και 700. Έτσι, η ίδια επίδειξη που εμφανίζεται με μία από αυτές τις γραμματοσειρές θα εμφανίζει μόνο δύο βάρη στις εννέα παραγράφους.

Χρήση λέξεων-κλειδιών "πιο τολμηρών" και "ελαφρύτερων"

Οι τιμές λέξεων-κλειδιών bolderκαι lighterσχετίζονται με το υπολογισμένο βάρος γραμματοσειράς του γονικού στοιχείου. Το πρόγραμμα περιήγησης θα αναζητήσει το πλησιέστερο "τολμηρότερο" ή "ελαφρύτερο" βάρος, ανάλογα με το τι είναι διαθέσιμο στην οικογένεια γραμματοσειρών, διαφορετικά θα επιλέξει απλώς "400" ή "700", ανάλογα με το ποιο έχει νόημα.

Τα θυγατρικά στοιχεία δεν θα κληρονομήσουν τις "πιο τολμηρές" και "ελαφρύτερες" τιμές λέξεων-κλειδιών, αλλά θα κληρονομήσουν το υπολογισμένο βάρος.

Υποστήριξη προγράμματος περιήγησης

Χρώμιο Σαφάρι Firefox ΛΥΡΙΚΗ ΣΚΗΝΗ ΙΕ Android iOS
Εργα Εργα Εργα Εργα Εργα Εργα Εργα