האתרים המושכים את המשתמשים דורשים לעתים קרובות צירוף מתודולוגיות סטיילינג מרובות מעת לעת. במצבים כאלה, הסגנון של קישוט הטקסט יכול להתבצע במספר דרכים בהתבסס על ערכים שונים בהתאם לדרישות כדי להבליט את האתר.
בלוג זה יכסה את תחומי התוכן הבאים:
כיצד להגדיר את סגנון קישוט הטקסט ב-Tailwind CSS?
ניתן להגדיר ולקשט את סגנון הטקסט בעזרת ' טקסט-קישוט-סגנון ” נכס שהוקצה עם ערכי סטיילינג שונים.
מאפייני סגנון קישוט טקסט
| מעמד | נכסים |
| קישוט-מוצק | טקסט-קישוט-סגנון: מוצק; |
| קישוט-כפול | טקסט-קישוט-סגנון: כפול; |
| קישוט-גלי | טקסט-קישוט-סגנון: גלי; |
| עיטור מקווקו | טקסט-קישוט-סגנון: מקווקו; |
| עיטור-מנוקד | סגנון טקסט-קישוט: מנוקד; |
דוגמה: הגדרת סגנון קישוט הטקסט ב-Tailwind CSS
דוגמה זו משתמשת ב-' טקסט-קישוט-סגנון ' מאפיין עם כל הערכים לסגנון טקסט הפסקה:
DOCTYPE html >< html >
< רֹאשׁ >
< מטא ערכת תווים = 'utf-8' >
< מטא שֵׁם = 'נקודת מבט' תוֹכֶן = 'width=device-width, initial-scale=1' >
< תַסרִיט src = 'https://cdn.tailwindcss.com' > תַסרִיט >
רֹאשׁ >
< גוּף >
< div >
< ע מעמד = 'קו תחתון קישוט מוצק...' > זהו אתר Linuxhint ע >
< ע מעמד = 'קו תחתון קישוט-כפול...' > זהו אתר Linuxhint ע >
< ע מעמד = 'קו תחתון קישוט-גלי...' > זהו אתר Linuxhint ע >
< ע מעמד = 'קו תחתון עם עיטור מקווקו...' > זהו אתר Linuxhint ע >
< ע מעמד = 'קו תחתון עם עיטורים מנוקדים...' > זהו אתר Linuxhint ע >
div >
גוּף >
html >
בהתבסס על קוד זה, החל את השלבים הבאים:
-
- כלול את הנתון ' CDN ' נתיב בתוך ' ' תג כדי להחיל את הפונקציות Tailwind.
- כעת, צור ארבע פסקאות באמצעות ' ' תג המכיל את ' טקסט-קישוט ” נכס שהוקצה עם ערך שונה בכל מקרה, כפי שנדון.
- כתוצאה מכך, זה מדגיש את הטקסט בקווים מוצקים, כפולים, גליים, מקווקוים ומקווקוים.
תְפוּקָה
מתוצאה זו, מוכח שהטקסט עוצב בהתאם.
סיכום
ניתן להגדיר ולקשט את סגנון הטקסט בעזרת ' טקסט-קישוט-סגנון ” נכס שהוקצה עם ערכי סטיילינג שונים. ערכים אלה כוללים מוצק, כפול, גלי, מקווקו ומקווקו. הבלוג הזה עסק בהגדרת סגנון קישוט הטקסט באמצעות Tailwind CSS.