תיעוד ודוגמאות לתגים, רכיב הספירה הקטנה והתיוג שלנו.
דוגמא
קנה מידה של תגים מתאים לגודל רכיב האב המיידי באמצעות גודל גופן emויחידות יחסיים.
כותרת לדוגמה
חָדָשׁ
כותרת לדוגמה
חָדָשׁ
כותרת לדוגמה
חָדָשׁ
כותרת לדוגמה
חָדָשׁ
כותרת לדוגמה
חָדָשׁ
כותרת לדוגמה
חָדָשׁ
ניתן להשתמש בתגים כחלק מקישורים או כפתורים כדי לספק מונה.
שימו לב כי בהתאם לאופן השימוש בהם, התגים עשויים לבלבל את המשתמשים בקוראי מסך ובטכנולוגיות מסייעות דומות. בעוד שהסגנון של התגים מספק רמז ויזואלי לגבי מטרתם, למשתמשים אלה פשוט יוצג תוכן התג. בהתאם למצב הספציפי, תגים אלה עשויים להיראות כמו מילים או מספרים אקראיים נוספים בסוף משפט, קישור או כפתור.
אלא אם ההקשר ברור (כמו בדוגמה של "התראות", שבה מובן שה-"4" הוא מספר ההתראות), שקול לכלול הקשר נוסף עם קטע טקסט נוסף מוסתר ויזואלית.
וריאציות הקשריות
הוסף כל אחת ממחלקות השינוי המוזכרות למטה כדי לשנות את המראה של תג.
שימוש בצבע להוספת משמעות מספק רק אינדיקציה ויזואלית, שלא תועבר למשתמשים בטכנולוגיות מסייעות - כמו קוראי מסך. ודא שהמידע המסומן בצבע ברור מהתוכן עצמו (למשל הטקסט הגלוי), או כלול באמצעים חלופיים, כגון טקסט נוסף מוסתר .sr-onlyבכיתה.
תגי גלולות
השתמש .badge-pillבמחלקה של השינוי כדי להפוך את התגים למעוגלים יותר (עם border-radiusאופקי גדול יותר ונוסף padding). שימושי אם אתה מתגעגע לתגים מ-v3.