Πώς να κάνετε διαγραμμένο κείμενο σε CSS

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

διαγραφή κειμένου

Ανάθεση

Είναι δυνατό να τονιστεί και να διαγραφεί το κείμενο στο CSS μεχρησιμοποιώντας την εντολή "διακόσμηση κειμένου". Το αποτέλεσμα θα εξαρτηθεί από την καθορισμένη τιμή. Το CSS σχεδιάστηκε για να διαχωρίσει το λογικό και δομικό μέρος μιας ιστοσελίδας. Αλλά πριν από την εμφάνιση των cascading φύλλων στυλ χρησιμοποιήθηκαν ετικέτες HTML, οι οποίες είχαν παρόμοια σημασία. Για παράδειγμα, ένα στοιχείο όπως το <strike> σας επιτρέπει να εξάγετε κείμενο διαγραφής. Τώρα αυτή η ετικέτα θεωρείται ανεπιθύμητη και η χρήση της θα κάνει αυτόματα τον κωδικό σελίδας σας μη έγκυρο. Αν και αυτό το στοιχείο <strike> εξακολουθεί να υποστηρίζεται από όλα τα σύγχρονα προγράμματα περιήγησης και χρησιμοποιείται από ορισμένους προγραμματιστές. Αλλά πίσω στο CSS. Η εντολή "διακόσμηση κειμένου" μπορεί να έχει τις ακόλουθες τιμές:

  • Υπογράμμιση. Με την ανάθεση αυτής της τιμής, παίρνετε το υπογραμμισμένο κείμενο.
  • Υπέρβαση. Η γραμμή θα περάσει πάνω από ένα συγκεκριμένο κομμάτι της σελίδας.
  • Διέλευση γραμμής. Δημιουργεί ένα κείμενο διαγραφής ή διαγραφής.
  • Αναβοσβήνει. Το επιλεγμένο κομμάτι του εγγράφου θα εξαφανιστεί περιοδικά και θα εμφανιστεί ξανά.
  • Επίσης, υπάρχουν τιμές "κανένας" και "κληρονομούν". Ο πρώτος ακυρώνει όλα τα εφέ και οι δεύτερες εντολές κληρονομούν την ιδιότητα του γονικού στοιχείου.

διαγράψτε το κείμενο

Σκοπός

Φαίνεται ότι στο CSS υπάρχει διαγραμμένο κείμενο καιΠαρόμοια αποτελέσματα χρησιμεύουν μόνο για τη διακόσμηση του κειμένου. Στις περισσότερες περιπτώσεις, αυτή η δήλωση είναι αλήθεια. Αλλά μερικές φορές αξίζει να εξεταστεί το ερώτημα: ποια ήταν τα στοιχεία; Για παράδειγμα, μια ήδη παρωχημένη ετικέτα "strike" χρησιμοποιήθηκε για να αναφερθεί σε λανθασμένες ή παλιές πληροφορίες. Οι αναγνώστες, βλέποντας το διαγραμμένο κείμενο, κατανοούν την κρυφή έννοια αυτής της συμβολής. Οι υπογραμμισμένες λέξεις διακρίνονται πάντα από τη γενική ροή. Επομένως, αυτό το φαινόμενο πρέπει να χρησιμοποιείται για την επισήμανση σημαντικών πληροφοριών. Η τιμή του "blink", που κάνει το κείμενο να αναβοσβήνει, χρησιμοποιείται πολύ σπάνια, καθώς μεταξύ των προγραμματιστών θεωρείται ότι είναι ένα τέτοιο απαράδεκτο αποτέλεσμα. Μετά από όλα, λίγοι από τους αναγνώστες σας όπως τρεμοπαίζει σύμβολα που θα τους αποσπούν συνεχώς. Λοιπόν, η τιμή του "overline" χρησιμοποιείται μόνο για τη διακόσμηση του κειμένου.

css strikeout

Χαρακτηριστικά

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

Συμπέρασμα

Επιδράσεις όπως διαγραφή κειμένου και άλλαπαρόμοιες τιμές χρησιμοποιούνται συχνά στο διαδίκτυο. Η χρήση τους σας επιτρέπει να εκφράσετε σωστά την κύρια ιδέα του συγγραφέα, βοηθώντας να εστιάσετε την προσοχή των αναγνωστών στο απαραίτητο μέρος του κειμένου. Αλλά μην είστε υπερβολικά ζήλο και σε κάθε ευκαιρία να εφαρμόσετε την ιδιότητα της "διακόσμησης κειμένου". Μετά από όλα, περιττό στολισμό του κειμένου μπορεί να βλάψει εσάς και τους αναγνώστες σας.

Σχετικά νέα