כיצד ליישם קישוט טקסט באמצעות CSS



מאמר זה יספק לך ידע מפורט ומקיף על סוגים שונים של קישוט טקסט באמצעות CSS עם דוגמאות.

הדגשת מסמך או טקסט תמיד נחשבת קלה. אבל אם ניקח בחשבון את המקרה לגבי אתרי האינטרנט, האם זה עדיין קל? רובנו היינו אומרים כן, אך ביצוע קו אופקי כולל כמה עיצובים מותאמים אישית הופך את המשימה הפשוטה הזו למעיקה. בואו להתחיל את המסע של קישוט הטקסט באמצעות CSS באופן הבא:

אלגוריתם חיפוש בינארי בג'אווה

מהו קישוט טקסט?

זה קובע את מראה הקווים הדקורטיביים על הטקסט. זהו נכס קצר עבור:





  • טקסט-קישוט-קו
  • טקסט-קישוט-צבע
  • נוסח קישוט טקסט

זה מוגדר כערך אחד או יותר המופרדים מרווחים המייצגים את הטה ארוכת הידמאפייני קישוט XT.

תחביר:



קישוט טקסט: || ||

איפה,

  • טקסט-קישוט-שורה: הוא משמש לקביעת סוג הקישוט המשמש כמוקו תחתון, קו מתאר וקו דרך.

  • טקסט-קישוט-צבע:משתמשים בו לקביעת צבע הקישוט.



  • נוסח קישוט טקסט: הוא משמש לקביעת סגנון הקו כגוןמוצק, גלי, מנוקד, מקווקו, כפול

סוגי קישוטי טקסט ב- CSS

  • קו אוברליין:
#decoration {text-decoration: overline}

Overline-text-decoration-using-css

  • קו דרך:
#decoration {טקסט-קישוט: קו-דרך}

  • לָשִׂים דָגֵשׁ:
#decoration {טקסט-קישוט: קו תחתון}

  • קוֹמבִּינַצִיָה:
#decoration {קישוט טקסט: קו תחתון קו קו)

תְפוּקָה:

קישוט טקסט באמצעות CSS: קוד

קוד:

  

קוד CSS:

שיטת מיון c ++
#overline {טקסט-קישוט: גלי סיד קו} # underover {טקסט-קישוט: קו תחתון מקועקף} # מנוקד {טקסט-קישוט: קו תחתון מנוקד באדום} # גלי {טקסט-קישוט: קו דרך גלי}

תְפוּקָה:

דלג על קישוט טקסט

ניתן להשתמש במאפיין המכונה טקסט-קישוט-דלג גם כאשר קו טקסט, קו שורה וקו תחתון. זה עוזר בקישוט הטקסט. הוא פשוט מפרט כיצד קוים קו תחתון וקו תחתון כאשר הם עוברים מעלים ועולים.

#decoration {text-decoration-skip: ink}

ערכים בהם ניתן להשתמש בדילוגים על קישוט טקסט הם:

  • חפצים : (ברירת מחדל) שורה מדלגת על אובייקטים מוטבעים, כמו תמונות או רכיבי בלוק מוטבע.

  • אף אחד : קו חוצה הכל.

  • רווחים : קו עיטור מדלג על רווחים, תווים של מפריד מילים וכל רווח שמוגדר בריווח אותיות או רווחי מילים.

    כיצד להשתמש בחבילה
  • דְיוֹ : קו קישוט מדלג על גליפים, יורדים או עולים.

  • קצוות : קו קישוט מתחיל מעט אחרי קצה ההתחלה של התוכן ומסתיים מעט לפני קצה הסיום של התוכן.

  • קופסא-קישוט : קו קישוט מדלג על שוליים, גבול וריפוד בירושה.

מכיוון שמאפיין זה אינו נתמך על ידי אף דפדפן, עדיין אין הדגמה, אך הנה דוגמה בתמונה למטה כיצד כל אחד מהערכים יכול להיראות לאחר הטמעת דלג על קישוט טקסט.

עם זאת, אנו מגיעים לסוף קישוט טקסט זה באמצעות הבלוג CSS. אם יש לך שאלות בנוגע לנושא זה, השאיר תגובה למטה ונחזור אליך.

בדוק את שלנו שמגיע עם הדרכה חיה בהנחיית מדריך וניסיון פרויקט אמיתי. הכשרה זו גורמת לך להיות בקיאים במיומנויות לעבוד עם טכנולוגיות אינטרנט מקדימות וקדמיות. הוא כולל הדרכה בנושא פיתוח אתרים, jQuery, Angular, NodeJS, ExpressJS ו- MongoDB.

יש לך שאלה עבורנו? אנא הזכיר זאת בקטע ההערות בבלוג 'קישוט טקסט באמצעות CSS' ונחזור אליך.