λογισμικό

* Γνώση Υπολογιστών >> λογισμικό >> Ανοικτού κώδικα

Ο κώδικας για το μέγεθος γραμματοσειράς Κειμένου

Εάν είστε νέοι στο σχεδιασμό ιστοσελίδων με HTML και CSS , δεν μπορείτε να συνειδητοποιήσετε το ποσό των σχεδιαστών ελέγχου έχουν πάνω από το μέγεθος του κειμένου , σε σύγκριση με ό, τι ήταν διαθέσιμο κατά την γέννηση του Web . Στην πραγματικότητα , οι διαθέσιμες επιλογές για τα μεγέθη των γραμματοσειρών μπορεί σχεδόν να προκαλέσει σύγχυση . Μια ποικιλία μεθόδων είναι διαθέσιμη για να ελέγχουν το μέγεθος των γραμματοσειρών που εμφανίζονται σε μια ιστοσελίδα . Αυτό είναι πιο συχνά γίνεται με τη χρήση CSS ( Cascading Style Sheets) αντί για την παλιά μέθοδο ταυτοποίησης κάθε στυλ σε κάθε γραμμή του κειμένου σε HTML ( Hyper Text Markup Language ) αρχείο . Κωδικός Format με CSS
Η

Όταν χρησιμοποιείτε CSS , μπορείτε να ορίσετε πολύ συγκεκριμένα μεγέθη γραμματοσειράς και την εφαρμογή τους σε ομάδες του κειμένου , το οποίο θα ορίσει με ετικέτες . Μπορείτε να δημιουργήσετε είτε ένα εξωτερικό αρχείο CSS και να επισυνάψετε το αρχείο HTML που περιέχει το περιεχόμενο της σελίδας σας , ή μπορείτε να συμπεριλάβετε εσωτερικούς κώδικες CSS στυλ στο κεφάλι του αρχείου HTML . Όποια μέθοδο κι αν προτιμάτε , το βασικό κώδικα για τον καθορισμό του μεγέθους της γραμματοσειράς μοιάζει με αυτό :

h1 { font-size : 40px ? }

Αυτό σημαίνει ότι κάθε κείμενο που έχετε ορίσει ως " h1 " σε το αρχείο HTML θα έχουν μέγεθος 40 pixels . Αν έχετε προβλήματα με το μέγεθος του κειμένου που εμφανίζεται αυτό το μέγεθος , βεβαιωθείτε ότι η ετικέτα ανοίγει και κλείνει με αγκύλες . Επίσης, βεβαιωθείτε ότι η τιμή τελειώνει με άνω τελεία , και ότι δεν υπάρχει χώρος για τον αριθμό της αξίας και « px . "
Εικόνων Πρότυπο Τύπος Ετικέτες
Η

Συνήθως ένας σχεδιαστής χρησιμοποιεί ετικέτες header να ορίσετε διαφορετικά μεγέθη γραμματοσειράς που μπορεί να χρειαστεί σε όλη την ιστοσελίδα . Παραδοσιακά, αυτές οι ετικέτες ξεκινήσει με

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

, η οποία μπορεί να είναι πολύ μικρό κείμενο που βρέθηκαν σε ένα υποσέλιδο . Η ετικέτα

ορίζει τυπικό σώμα κειμένου που εμφανίζεται στις παραγράφους . Μπορείτε να ρυθμίσετε όλα αυτά τα επιμέρους μεγέθη της CSS stylesheet , στη συνέχεια, να επισυνάψουν το κείμενο γραμμένο σε HTML σας με τις ετικέτες .

Η χρήση απόλυτων τιμών
Η

σας μπορείτε να ρυθμίσετε το μέγεθος της γραμματοσειράς σε μια απόλυτη αξία , όπως pixels , χιλιοστά ή ίντσες , όπως στο ακόλουθο παράδειγμα :

p { font-size : 14pt ? }

Αυτό καθορίζει το μέγεθος της γραμματοσειράς για όλο το κείμενο μέσα στην ετικέτα

ως 14 βαθμούς . Αυτό είναι ένα παράδειγμα της απόλυτης μέγεθος, στην οποία το μέγεθος του κειμένου παραμένει ένα σταθερό μέγεθος . Ορισμένα προγράμματα περιήγησης σας επιτρέπουν να αλλάξετε αυτό το μέγεθος , το οποίο είναι χρήσιμο για τα άτομα με προβλήματα όρασης που πρέπει να αυξήσουν το μέγεθος του κειμένου για να το διαβάσετε . Ωστόσο, ο Internet Explorer δεν επιτρέπει σε σας για να αυξήσει το μέγεθος με αυτή την κωδικοποίηση .
Εικόνων Χρησιμοποιώντας Σχετική τιμές
Η

Πολλοί σχεδιαστές χρησιμοποιούν σχετικές τιμές για να αλλάξετε το μέγεθος της γραμματοσειράς . Αυτό καθορίζει το μέγεθος του κειμένου σε σχέση με άλλα στοιχεία και σας επιτρέπει να αλλάξετε το μέγεθος σε όλους τους browsers . Σχετική τιμές περιλαμβάνουν pixels , ποσοστά και ems . Ems είναι η μονάδα που συνιστάται από το World Wide Web Consortium ( W3C ) . Μια μέτρηση 1 em είναι ισοδύναμο με το προεπιλεγμένο μέγεθος της γραμματοσειράς σε ένα πρόγραμμα περιήγησης στο Web , το οποίο είναι 16 pixels . Μπορείτε να καθορίσετε το μέγεθος της γραμματοσειράς σε ems με τον ακόλουθο κώδικα :

h2 { font-size : 1.875em ? }

Λόγω των συνεχιζόμενων προβλημάτων με τη συμβατότητα στον Internet Explorer , το W3C συστήνει έναν συνδυασμό ποσοστά και ems να εξασφαλίσει ως πρότυπο μια εμπειρία θέασης όσο το δυνατόν σε όλους τους browsers . Συνιστούν τον παρακάτω κώδικα για να ορίσετε ένα πρότυπο μεγέθους γραμματοσειράς :

body { font-size : 100 % ? }

Και στη συνέχεια να καθορίσετε διάφορες επικεφαλίδα και η παράγραφος μεγέθη σας βασίζεται στα ανοικτά της ότι :

h1 { font-size : 2.25em ? }

p { font-size : 0.8em ? }
Η
εικόνων

Συναφής σύστασή

Πνευματικά δικαιώματα © Γνώση Υπολογιστών Όλα τα δικαιώματα κατοχυρωμένα