important – ככה עוקפים inline style עם CSS

כל מי שעסק ולו במעט ב-Client Side מכיר את ההיררכיה שיש ב-CSS – היררכיה שמובנית בתוך ה-CSS עצמו. inline style היא שיטה מרגיזה למדי לשלב style כפרמטר בתוך ה-HTML עצמו. כך למשל אנו יוצרים CSS עבור פסקה:


p {
text-align: left;
}

וכך אנו עושים זאת ב-inline style:


<p style="text-align: left;">
Some example content...
</p>

תמיד ה-inline style גובר על קובץ ה-CSS. הבעיה היא שלעיתים אין לנו שליטה על ה-inline style ואנו עדיין צריכים לשנות את התכונות של האלמנט ולבטל את ה-inline style. בדיוק בשביל זה יש את תגית inportant ב-CSS שגורמת ל-CSS לנצח בקרב על עיצוב האלמנט ולגבור על ה-inline style. איך עושים את זה? בקלות:


p {
text-align: left  !important;
}

לתגית הזו יש עדיפות עליונה שגוברת על ה-inline style.

צריך כמובן מאד להזהר עם !important; שימוש יתר בתגית הזו יכול לפגום בפעולתם של סקריפטים של jQuery וספריות אחרות שמשתמשות בשינוי תכונות inline על מנת ליצור אפקטים שונים (כמו פתיחה וסגירה של קופסאות תוכן למשל). התגית הזו נועדה למצבים נדירים שבהם אין לנו שליטה על ה-inline style או על סקריפט שמשנה אותו. אם תשאלו אותי, עדיף לא להשתמש בכלל ב-inline style.

פוסטים נוספים שכדאי לקרוא

מיקרו בקרים

חיבור מצלמה למיקרובקר

חיבור מצלמה למיקרו בקר ויצירה של מצלמת אבטחה מרחוק בעלות של 20 שקל.

בינה מלאכותית

להריץ ממשק של open-webui על הרספברי פיי

להפעיל ממשק של צ׳אט ג׳יפיטי שאפשר לגשת אליו מכל מחשב ברשת הביתית על רספברי פיי עם מודל בשם tinydolphin שרץ על רספברי פיי.

פתרונות ומאמרים על פיתוח אינטרנט

המנעו מהעלאת source control לשרת פומבי

לא תאמינו כמה אתרים מעלים את ה-source control שלהם לשרת. ככה תמצאו אותם וגם הסבר למה זה רעיון רע.

תמונת תצוגה של מנעול על מחשב
פתרונות ומאמרים על פיתוח אינטרנט

הגנה מפני XSS עם Trusted Types

תכונה ב-CSP שמאפשרת מניעה כמעט הרמטית להתקפות XSS שכל מפתח ווב צריך להכיר וכדאי שיכיר.

גלילה לראש העמוד