Χρώμα γραμματοσειράς HTML. Πώς να αλλάξετε το χρώμα της γραμματοσειράς σε HTML χρησιμοποιώντας το πρόγραμμα περιήγησης ιστού Google Chrome
Σε αυτό το σεμινάριο θα εξετάσουμε το χαρακτηριστικό της τελευταίας ετικέτας , που ορίζει το χρώμα του κειμένου. Από προεπιλογή, το κείμενο είναι μαύρο, το οποίο εμφανίζεται σε λευκό φόντο. Ωστε να αλλαγή χρώματος κειμένου σε html, πρέπει να εφαρμόσετε το χαρακτηριστικό χρώματος της ετικέτας :
Για να ορίσετε ένα χρώμα, απλώς καθορίστε το όνομά του, για παράδειγμα: κόκκινο, πράσινο, μπλε. Ας δούμε ένα μικρό παράδειγμα:
Πράσινο κείμενο
Κόκκινο κείμενο
Μωβ κείμενο
Ας δούμε το αποτέλεσμα στο πρόγραμμα περιήγησης:
Το κείμενο στην πρώτη παράγραφο έγινε πράσινο, η δεύτερη παράγραφος έγινε κόκκινη και η τρίτη παράγραφος έγινε μοβ. Συνολικά υπάρχουν 16 ονόματα βασικών χρωμάτων και 130 επιπλέον. Μπορείτε να δείτε την πλήρη λίστα χρωμάτων στον πίνακα χρωμάτων html.
Αυτός ο τρόπος ένδειξης του χρώματος είναι πολύ απλός, αλλά πολύ περιορισμένος. Επομένως, για να αλλάξουν το χρώμα στον κώδικα HTML, χρησιμοποιούν συχνά έναν δεκαεξαδικό αριθμό που προηγείται από ένα σύμβολο κατακερματισμού (#), για παράδειγμα:
Χρησιμοποιώντας αυτόν τον χαρακτηρισμό, μπορείτε να πάρετε περισσότερα από 16 εκατομμύρια χρώματα και τις αποχρώσεις τους! Μπορείτε να λάβετε τον χρωματικό κώδικα χρησιμοποιώντας τον χρωματικό κώδικα που είναι διαθέσιμος στον ιστότοπο ή χρησιμοποιώντας την χρωματική παλέτα στο Photoshop. Ας δούμε ένα παράδειγμα και γράψτε τον παρακάτω κώδικα:
Πράσινο κείμενο
Κόκκινο κείμενο
Μωβ κείμενο
Ας αποθηκεύσουμε το αρχείο και ας δούμε το αποτέλεσμα:
Όπως μπορείτε να δείτε, ορίσαμε το κείμενο στα ίδια χρώματα όπως στο πρώτο παράδειγμα, μόνο εδώ χρησιμοποιήσαμε το δεκαεξαδικό σύστημα αριθμών ή με άλλα λόγια, ορίσαμε το χρώμα σε μορφή HEX.
Τώρα μάθατε πώς να αλλάζετε το χρώμα του κειμένου σε html και στο τέλος του μαθήματος προτείνω να επαναλάβετε όλα τα χαρακτηριστικά της ετικέτας και ορίστε πολλές παραμέτρους στο κείμενο ταυτόχρονα, δηλαδή: γραμματοσειρά, μέγεθος και χρώμα. Γράψε ένα παράδειγμα:
Ορίστε τη γραμματοσειρά, το μέγεθος και το χρώμα του κειμένου
Ορίστε τη γραμματοσειρά, το μέγεθος και το χρώμα του κειμένου
Για να αλλάξετε τη γραμματοσειρά χρησιμοποιήστε μια ετικέτα με το χαρακτηριστικό FACE. Μπορείτε να καθορίσετε τη γραμματοσειρά με το όνομα (Arial, Tahoma, Verdana) ή να πληκτρολογήσετε (για παράδειγμα, monospace). Συνιστάται να αναφέρετε πολλά ονόματα γραμματοσειρών για να αποφύγετε μια κατάσταση όπου αποδεικνύεται ότι ο χρήστης δεν έχει εγκαταστήσει την απαιτούμενη γραμματοσειρά. Συνιστώ να χρησιμοποιήσετε τουλάχιστον μία από τις γενικά αποδεκτές γραμματοσειρές (για παράδειγμα Arial). Δεν συνιστώ τη χρήση περισσότερων από 2-3 διαφορετικών γραμματοσειρών σε μια σελίδα, διαφορετικά η σελίδα θα φαίνεται αδέξια και αντιεπαγγελματική.
Παράδειγμα:
Αλλαγή του μεγέθους γραμματοσειράς μιας σελίδας html
Για να αλλάξετε το μέγεθος της γραμματοσειράς, χρησιμοποιήστε το χαρακτηριστικό SIZE. Όσο μεγαλύτερη είναι η γραμματοσειρά, τόσο πιο εύκολο γίνεται η ανάγνωση του κειμένου. Ωστόσο, η μικρή γραμματοσειρά σάς επιτρέπει να χωρέσετε περισσότερες πληροφορίες στην οθόνη. Χρησιμοποιώντας αυτό το χαρακτηριστικό με μια ετικέτα
Μπορείτε να αλλάξετε τη γραμματοσειρά χρησιμοποιώντας ετικέτες Και . μεγεθύνει τη γραμματοσειρά του καθορισμένου τμήματος σε σχέση με το προηγούμενο κείμενο και , κατά συνέπεια, μειώνει.
Αλλάζοντας το μέγεθος μεμονωμένων γραμμάτων, μπορείτε να επιτύχετε ενδιαφέροντα εφέ. Για παράδειγμα, με αυτόν τον τρόπο μπορείτε να πάρετε ένα drop cap - ένα μεγάλο κεφαλαίο γράμμα στην αρχή μιας παραγράφου.
Παράδειγμα:
Επιλέγοντας το χρώμα της γραμματοσειράς μιας σελίδας html
Η εμφάνιση τμημάτων του κειμένου μιας ιστοσελίδας με διαφορετικές χρωματικές γραμματοσειρές το καθιστά πιο ελκυστικό.
Χρησιμοποιώντας το χαρακτηριστικό TEXT στο πλαίσιο μιας ετικέτας
, μπορείτε να αλλάξετε ολόκληρο το χρώμα κειμένου μιας ιστοσελίδας. Εφαρμογή του χαρακτηριστικού COLOR με μια ετικέτα (έχει μεγαλύτερη προτεραιότητα) σας επιτρέπει να αλληλεπιδράτε με την εμφάνιση ενός μεμονωμένου κειμένου.Για να αλλάξετε το χρώμα του κειμένου, πρέπει να γνωρίζετε το όνομα του χρώματος ή τον δεκαεξαδικό κωδικό του. Ο κωδικός αποτελείται από το σύμβολο λίρας # και έναν αριθμό που αντιπροσωπεύει την ένταση των κόκκινων, πράσινων και μπλε συστατικών του χρώματος. Μόνο 16 τυπικά χρώματα μπορούν να αναφέρονται ονομαστικά.
Όνομα χρωμάτων Κωδικός aqua ##00FFFF μαύρο ##000000 μπλε ##0000FF φούξια ##FF00FF γκρι ##808080 πράσινο ##008000 lime ##00FF00 καφέ ##800000 ναυτικό ##0000080 olive #0#0000 πορφυρό #0#808 #FF0000 ασημί ##C0C0C0 teal ##008080 λευκό ##FFFFFF κίτρινο ##FFFF00
Όταν δημιουργείτε μια ιστοσελίδα, πρέπει να αντιμετωπίσετε διάφορες προκλήσεις σχεδιασμού. Μια από τις συνηθισμένες ερωτήσεις είναι πώς να αλλάξετε το χρώμα του κειμένου σε HTML. Η επίλυσή του είναι αρκετά απλή και υπάρχουν δύο διαφορετικοί τρόποι.
Ορισμός χαρακτηριστικού στυλ ενσωματωμένου κειμένου
Για να κατανοήσετε πώς μπορείτε να αλλάξετε το χρώμα του κειμένου σε HTML, απλώς κοιτάξτε τη λίστα με τα χαρακτηριστικά του πεδίου κειμένου. Ανάμεσά τους υπάρχει ένας αριθμός τιμών που καθορίζουν το στυλ του κειμένου που περικλείεται σε αυτές τις ετικέτες, οι οποίες καθορίζονται μέσα στη λέξη-κλειδί στυλ.
Για να αλλάξετε το χρώμα του κειμένου, απλώς εισαγάγετε τη λέξη style= "" στην επιλεγμένη περιοχή του πεδίου κειμένου μέσα στην ετικέτα ανοίγματος. Μέσα σε αυτό το χαρακτηριστικό, μπορείτε να καθορίσετε διαφορετικές τιμές παραμέτρων - η τιμή του χαρακτηριστικού χρώματος είναι υπεύθυνη για την αλλαγή του χρωματικού τόνου του κειμένου. Καθορίζοντας αυτήν την παράμετρο, μετά το σύμβολο άνω και κάτω τελείας θα πρέπει να καθορίσετε το χρώμα στο οποίο θα χρωματιστούν όλοι οι χαρακτήρες σε αυτό το πεδίο. Σε αυτήν την περίπτωση, όταν ορίζετε μια απόχρωση, μπορείτε να καθορίσετε τόσο μια ρητή τιμή χρώματος, για παράδειγμα, κόκκινο ή κίτρινο, όσο και τη δεκαεξαδική τιμή του ή rgb.
Ανεξάρτητα από την επιλεγμένη μέθοδο για τον προσδιορισμό του χρώματος, το αποτέλεσμα θα είναι το ίδιο εάν η απόχρωση επιλεγεί με τον ίδιο τρόπο. Έτσι, και τα τρία ακόλουθα παραδείγματα θα κάνουν τις ίδιες αλλαγές στο κείμενο - χρωματίστε το κίτρινο.
1.
κείμενο
2.
κείμενο
3.
κείμενο
Αλλαγή χρώματος με χρήση CSS
Η χρήση ενός φύλλου στυλ σάς επιτρέπει επίσης να αποφασίσετε πώς να αλλάξετε το χρώμα του κειμένου σε HTML. Το CSS υποστηρίζεται πλήρως από όλες τις σύγχρονες εκδόσεις HTML και σας επιτρέπει επίσης να αλλάξετε το στυλ πολλών στοιχείων σελίδας ταυτόχρονα.
Για να κατανοήσετε πώς να αλλάξετε το χρώμα του κειμένου σε HTML χρησιμοποιώντας CSS, δεν χρειάζεται να κατανοήσετε τη γλώσσα επίσημης εμφάνισης. Για να ορίσετε τα χαρακτηριστικά ενός συγκεκριμένου στοιχείου, πρέπει να δημιουργήσετε μια περιγραφή CSS που είναι γραμμένη μέσα στην ετικέτα
, και ορίζεται από την ετικέτα