Πώς να χρησιμοποιήσετε τον πίνακα κειμένου στον πίνακα ιδιοτήτων CSS του Dreamweaver - dummies

Ο πίνακας Dreamweaver Text περιέχει μια συλλογή από επιλογές που ελέγχουν την εμφάνιση του κειμένου στις σελίδες σας. Μπορείτε να αποκτήσετε πρόσβαση στις επιλογές Πίνακα κειμένου, μεταβαίνοντας προς τα κάτω τον πίνακα ιδιοτήτων μέχρι να φτάσετε κάτω από τις επιλογές διάταξης ή κάνοντας κλικ στο εικονίδιο T στο επάνω μέρος του πίνακα.

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

• Χρώμα: Ρυθμίστε το χρώμα κειμένου. Μπορείτε να κάνετε κλικ στο χρώμα καλά και να επιλέξετε ένα χρώμα, χρησιμοποιήστε το σταγονόμετρο για να δοκιμάσετε οποιοδήποτε χρώμα στην οθόνη ή εισαγάγετε έναν δεκαεξαδικό κωδικό χρώματος στο πεδίο χρώματος. Εάν εισαγάγετε έναν δεκαεξαδικό κωδικό χρώματος, συμπεριλάβετε την αρχή της λίστας λίβρας (#).

• Font-Family: Ορίστε μια οικογένεια γραμματοσειρών ή μια σειρά οικογενειών. Μπορείτε να προσθέσετε γραμματοσειρές από τον τοπικό σκληρό σας δίσκο ή από το Adobe TypeKit επιλέγοντας Διαχείριση γραμματοσειρών στο κάτω μέρος της αναπτυσσόμενης λίστας και εκκίνησης του πλαισίου διαλόγου Διαχείριση γραμματοσειρών.

  

• Στυλ γραμματοσειράς: Εισάγετε Κανονικό, πλάγια ή λοξή. Ωστόσο, πλάγια και πλάγια είναι σπάνια διαφορετικά σε ένα πρόγραμμα περιήγησης ιστού, έτσι ώστε να κολλήσετε με πλάγια γράμματα αν δεν έχετε συγκεκριμένο λόγο να μην το κάνετε.

• Παραλλαγή γραμματοσειράς: Αλλαγή κειμένου σε μικρά καπάκια. Δοκιμάστε προσεκτικά τα σχέδιά σας, επειδή αυτό το χαρακτηριστικό δεν υποστηρίζεται από όλα τα προγράμματα περιήγησης.

• Γραμματοσειρά-Βάρος: Κάντε το κείμενο να εμφανίζεται με έντονα γράμματα επιλέγοντας Bold ή Bolder από την αναπτυσσόμενη λίστα. Μπορείτε επίσης να εισαγάγετε έναν αριθμό μεταξύ 100 και 900 για ακριβέστερο έλεγχο της έντασης του κειμένου. Για να αφαιρέσετε έντονη μορφοποίηση, επιλέξτε Κανονική ή Ανοιχτό.

• Μέγεθος γραμματοσειράς: Καθορίστε το μέγεθος του κειμένου. Μπορείτε να επιλέξετε ένα συγκεκριμένο αριθμητικό μέγεθος ή ένα σχετικό μέγεθος. Οι επιλογές μεγέθους είναι pixel (px), σημείο (pt), pica (pc), ποσοστό (%), em, rem, ex και ch. Τα εικονοστοιχεία, τα ems και τα ποσοστά είναι οι πιο συχνά χρησιμοποιούμενες επιλογές για τα μεγέθη κειμένου.

• Ύψος γραμμής: Καθορίστε το ύψος της γραμμής στην οποία τοποθετείται το κείμενο. Όπως το μέγεθος κειμένου, μπορείτε να καθορίσετε το ύψος της γραμμής με διάφορους τρόπους, συμπεριλαμβανομένων των εικονοστοιχείων, των ems και των ποσοστών. Είναι καλή πρακτική στον ιστό να προσθέσετε ύψος γραμμής, επειδή η αύξηση του χώρου γύρω από το κείμενο σας διευκολύνει την ανάγνωση σε μια οθόνη υπολογιστή.

• Ευθυγράμμιση κειμένου: Αριστερά ευθυγραμμίστε, ευθυγραμμίστε δεξιά, κεντράρετε ή δικαιολογήστε το κείμενό σας κάνοντας κλικ στο αντίστοιχο εικονίδιο. Το πρώτο εικονίδιο, για το Inherit, είναι το προεπιλεγμένο. Για παράδειγμα, θα μπορούσατε να κεντράρετε το κείμενο στο υποσέλιδο της ιστοσελίδας σας, συμπεριλαμβάνοντας το Ρύθμιση λέξεων-κλειδιών στο Κέντρο στον ορισμό ενός στυλ που εφαρμόζετε στην ετικέτα στο κάτω μέρος της σελίδας.

• Διακόσμηση κειμένου: Καθορίστε εάν το κείμενο είναι υπογραμμισμένο, επικαλυμμένο, εμφανίζεται με διαγραφή ή εμφανίζεται με το φαινόμενο αναλαμπής.Μπορείτε επίσης να επιλέξετε Κανένα, το οποίο χρησιμοποιείται συχνά για να αφαιρέσετε την υπογράμμιση από το συνδεδεμένο κείμενο.

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

Γιατί τόσες γραμματοσειρές;

Μπορεί να έχετε ακούσει ότι μπορείτε τώρα να χρησιμοποιήσετε οποιαδήποτε γραμματοσειρά που θέλετε στις ιστοσελίδες σας, χάρη στην τελευταία έκδοση του Cascading Style Sheets, CSS3. Αυτή η δήλωση είναι αλήθεια αλλά με ορισμένους περιορισμούς: Πρέπει να έχετε το νόμιμο δικαίωμα να δημοσιεύσετε τη γραμματοσειρά και η γραμματοσειρά πρέπει να φιλοξενείται σε έναν διακομιστή ιστού.

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

• Gotham, Helvetica Nue, Helvetica, Arial, sans serif

• Cambria, Hoefler Κείμενο, Liberation Serif, Times, Times New Roman, τις δικές σας συλλογές γραμματοσειρών χρησιμοποιώντας το παράθυρο διαλόγου Διαχείριση γραμματοσειρών, το οποίο είναι προσβάσιμο επιλέγοντας την επιλογή Διαχείριση γραμματοσειρών στο κάτω μέρος της αναπτυσσόμενης λίστας Οικογένεια γραμματοσειρών στον πίνακα κειμένου στον πίνακα σχεδιαστή CSS.

Η ενότητα Text-Shadow του πλαισίου κειμένου

Η ενότητα Text-Shadow του πλαισίου κειμένου παρέχει εργαλεία για την προσθήκη σκιών κειμένου, μία από τις νεότερες ιδιότητες CSS που περιλαμβάνονται στον ορισμό CSS3. Οι πιο δημοφιλείς επιλογές είναι οι ακόλουθες:

Η-σκιά:

• Προσθέστε μια σκιά στο κείμενό σας στον οριζόντιο άξονα. Αρχικά επιλέξτε μια επιλογή μεγέθους και στη συνέχεια πληκτρολογήστε έναν αριθμό στο πεδίο. Για παράδειγμα, πληκτρολογήστε 2px, για να προσθέσετε μια οριζόντια σκιά πλάτους 2 pixel. Σκιά V:

• Προσθέστε μια σκιά στο κείμενό σας στον κάθετο άξονα. Αρχικά επιλέξτε μια επιλογή μεγέθους και στη συνέχεια πληκτρολογήστε έναν αριθμό στο πεδίο. Blur:

• Ελέγξτε την ποσότητα θολώματος στη σκιά. Όσο μεγαλύτερος είναι ο αριθμός, τόσο περισσότερο η σκιά είναι απλωμένη ή θολή. Χρώμα:

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

  

Μετατροπή κειμένου:

• Αλλάξτε την περίπτωση του κειμένου σας. Οι επιλογές είναι κεφαλαιοποίηση, κεφαλαία και μικρότερα. Κάντε κλικ στο αντίστοιχο εικονίδιο για να ορίσετε αυτήν την ιδιότητα. Διαχωριστικά γραμμάτων:

• Ορίζει την ποσότητα λευκού χώρου που παρεμβάλλεται μεταξύ των γραμμάτων. Οι επιλογές μεγέθους είναι pixel (px), σημείο (pt), pica (pc), ποσοστό (%), em, rem, ex και ch. Διαχωρισμός λέξεων:

• Ορίζει το μέγεθος του λευκού χώρου που εισάγεται μεταξύ των λέξεων. Οι επιλογές μεγέθους είναι pixel (px), σημείο (pt), pica (pc), ποσοστό (%), em, rem, ex και ch. (Δείτε την προηγούμενη πλαϊνή γραμμή "Συγκρίνοντας τις επιλογές μεγέθους CSS") White-Space:

• Πείτε στο πρόγραμμα περιήγησης πώς να χειριστείτε τα διαλείμματα γραμμής και τα κενά σε ένα μπλοκ κειμένου. Οι επιλογές σας είναι Κληρονομιά, Κανονική, Τώρα, Προ, Προ-γραμμή ή Προ-τυλίξτε. Το Nowrap είναι ιδιαίτερα χρήσιμο επειδή εμποδίζει τα στοιχεία να διαχωριστούν εάν πρέπει να τυλιχτούν για να χωρέσουν μέσα σε ένα παράθυρο του προγράμματος περιήγησης ή σε άλλο δοχείο. Κατακόρυφη-Ευθυγράμμιση:

• Ευθυγραμμίστε στοιχεία inline, όπως κείμενο και εικόνες, σε σχέση με τα στοιχεία που τα περιβάλλουν. Μπορείτε να ορίσετε μια αριθμητική τιμή ή να επιλέξετε Βασική γραμμή, Sub, Super, Top, Text-Top, Middle, Bottom και Text-Bottom.