Αρκετές σελίδες του e-commerce web app μας επιτρέπουν στους χρήστες να φιλτράρετε μια λίστα με το καθεστώς των αιτήσεων που έχουν υποβληθεί σε εμάς.
Τα φίλτρα είναι συνήθως κάτι σαν:
Όλα αναμονή Ολοκληρώθηκε
Έχουμε να συσταθεί ως σύνδεσμοι. Θα θέλαμε να τους στυλ, έτσι ώστε η ενεργή φίλτρο επισημαίνεται με ένα χρωματιστό ορθογώνιο (w / στρογγυλεμένες γωνίες, natch!) Και το κείμενο γίνεται λευκό.
Το ορθογώνιο αποκορύφωμα θα παραμείνει έως ότου ο χρήστης κάνει κλικ ένα από τα άλλα φίλτρα (εκκρεμότητα, Ολοκληρώθηκε) οπότε το αποκορύφωμα θα κινηθεί προς τη σύνδεση μόνο κλικ.
Ένα παράδειγμα αυτού εμφανίζεται σε διάφορα σημεία στο Facebook, όπου, για παράδειγμα, οι θέσεις τοίχο φιλτράρονται σε:
Dean + Φίλοι Απλά Dean Μόνο φίλοι
Υπάρχει ένας απλός τρόπος για να το κάνετε αυτό σε CSS, ίσως με το styling των πιο πρόσφατα «επισκέφθηκε» σχέση, αλλά σήμανση προηγουμένως πολυσύχναστες αφού κάποιος ή αυτές που υπάρχουν;
Ευχαριστώ,
Dean Richardson
