::first-letterείναι ένα ψευδο στοιχείο που σας επιτρέπει να μορφοποιήσετε το πρώτο γράμμα σε ένα στοιχείο, χωρίς να χρειάζεται να κολλήσετε μια ετικέτα γύρω από το πρώτο γράμμα στο HTML σας. Αν και δεν προστίθενται ετικέτες στο DOM, είναι σαν το πρώτο στοχευμένο γράμμα να περιλαμβάνεται σε μια ετικέτα. Μπορείτε να σχεδιάσετε αυτό το πρώτο γράμμα όπως θα κάνατε ένα πραγματικό στοιχείο με:
p::first-letter ( font-weight: bold; color: red; )
The first letter is bold and red
Το αποτέλεσμα είναι σαν να είχατε ένα faux στοιχείο γύρω από το πρώτο γράμμα:
The first letter is bold and red.
Το πρώτο γράμμα είναι έντονο και κόκκινο
- Το ψευδο στοιχείο λειτουργεί μόνο εάν το γονικό στοιχείο είναι ένα πλαίσιο κοντέινερ μπλοκ (με άλλα λόγια, δεν λειτουργεί στο πρώτο γράμμα των
display: inline;στοιχείων.) - Εάν έχετε
::first-letterκαι::first-lineένα στοιχείο και ένα στοιχείο, το πρώτο γράμμα θα κληρονομήσει από τα στυλ πρώτης γραμμής, αλλά τα στυλ στη::first-letterδιαθήκη θα αντικατασταθούν όταν τα στυλ έρχονται σε διένεξη. - Εάν δημιουργείτε περιεχόμενο με
::before, ο πρώτος χαρακτήρας γράμματος ή στίξης, είτε είναι μέρος του αρχικού κόμβου κειμένου είτε δημιουργείται με δημιουργημένο περιεχόμενο, θα είναι ο στόχος.
Περισσότερες πληροφορίες
- Όταν χρησιμοποιείτε για drop-caps, χρησιμοποιήστε το σε συνδυασμό με
p:first-of-typeαυτό ώστε να μην γίνεται στυλ του κάθε πρώτου γράμματος - Παράδειγμα στυλό - με δημιουργημένο περιεχόμενο
- W3C Wiki
- W3C CSS3 Selectors module
Υποστήριξη προγράμματος περιήγησης
Αυτά τα δεδομένα υποστήριξης του προγράμματος περιήγησης προέρχονται από την Caniuse, η οποία έχει περισσότερες λεπτομέρειες. Ένας αριθμός υποδεικνύει ότι το πρόγραμμα περιήγησης υποστηρίζει τη λειτουργία σε αυτήν την έκδοση και νεότερη.
Επιφάνεια εργασίας
| Χρώμιο | Firefox | ΙΕ | Ακρη | Σαφάρι |
|---|---|---|---|---|
| 9 | 3.5 | 9 | 12 | 5.1 |
Κινητό / Tablet
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| 88 | 85 | 3 | 5.0-5.1 |
Σημείωση: Για τον Internet Explorer 8 και κάτω, χρησιμοποιήστε ένα μόνο άνω και κάτω τελεία :first-letterαντί για τη σημείωση διπλού άνω και κάτω τελείας.