:: δείκτης - CSS-Κόλπα

Anonim

Το ::marker ψευδο-στοιχείο είναι για το στυλ του στιλιστικού δείκτη ενός στοιχείου λίστας. Για παράδειγμα, το σημείο κουκκίδας μιας προεπιλογής

    (π.χ. •) ή τον αριθμό μιας προεπιλογής
      (π.χ. 1.). Αυτό το καθιστά εξαιρετικά εύκολο να κάνετε απλά πράγματα όπως να τα χρωματίσετε.

      Όπως ένα ψευδο-στοιχείο, θα μπορείτε να επιλέξετε ::markerστο DevTools για έλεγχο, αλλά δεν είναι πραγματικά «στο DOM» σαν ένα κανονικό στοιχείο.

      Chrome DevTools επιλέγοντας το ::markerψευδο-στοιχείο και δείχνοντας τα στυλ.

      Μπορείτε να συνδυάσετε ::markerμε την contentιδιότητα για να αλλάξετε τι είναι ο δείκτης. Για παράδειγμα, αντικατάσταση κουκκίδων λίστας με emoji:

      Εάν αλλάξετε την display ιδιότητα list-itemσε οποιοδήποτε στοιχείο, μπορείτε να την ελέγξετε ::marker. Εδώ

      στοιχεία αριθμούνται, που συνδυάζει την ιδέα των μετρητών CSS:

      Οι δείκτες εξακολουθούν να είναι δείκτες λίστας, επομένως υπόκεινται σε πράγματα όπως list-style-position.

      Σχετιζομαι με

      Άρθρο στις 5 Μαΐου 2020

      Λίστα συνταγών στυλ

      Chris Coyier

      Περισσότερες πληροφορίες

      • Προδιαγραφές

      Υποστήριξη προγράμματος περιήγησης

      Αυτά τα δεδομένα υποστήριξης του προγράμματος περιήγησης προέρχονται από την Caniuse, η οποία έχει περισσότερες λεπτομέρειες. Ένας αριθμός υποδεικνύει ότι το πρόγραμμα περιήγησης υποστηρίζει τη λειτουργία σε αυτήν την έκδοση και νεότερη.

      Επιφάνεια εργασίας

      Χρώμιο Firefox ΙΕ Ακρη Σαφάρι
      86 68 Οχι 86 11.1

      Κινητό / Tablet

      Android Chrome Android Firefox Android iOS Safari
      88 85 81 11.3-11.4