התכונה aspect-ratio ב-CSS מאפשרת להגדיר את היחס בין רוחב לגובה של אלמנט. במקום לקבוע את שני המימדים בצורה מפורשת, מגדירים את היחס והדפדפן מחשב את המימד השני באופן אוטומטי. זה שימושי בכל מקום – תמונות רספונסיביות, מקומות שמורים לווידאו, פריסות [...]
"כלל ה-@property מעניק למשתני CSS יכולת שמעולם לא הייתה להם: מערכת טיפוסים (Type System). כעת אפשר להגדיר לדפדפן שמשתנה מסוים הוא צבע, זווית או אורך, ופתאום דברים כמו אנימציות גרדיאנט (gradients) או אנימציות ל borders למשל פשוט עובדים. אני התחלתי [...]
CSS מאפשר להגדיר borders בצבע אחד, אבל אינו תומך ב-gradient כברירת מחדל. אך ניתן עם כמה טכניקות להוסיף בכל זאת gradient borders לכפתורים, כרטיסים או כל דבר אחר כדי להבליט אלמנטים חשובים בעמוד. בפוסט הזה תלמדו מה זה gradient borders, [...]
הפונקציה image-set ב CSS מאפשרת להגדיר מספר גרסאות של אותה תמונה כך שהדפדפן יוכל לבחור את הגרסה האופטימלית ביותר באופן אוטומטי, כך שניתן יהיה לקבל ביצועים טובים יותר כמו גם לשמור על תאימות למכשירים ישנים. כשמדובר על פיתוח אתרים השימוש [...]
הטמעת טופס של HubSpot ישירות בתוך קובץ תבנית של ערכת העיצוב באתר וורדפרס מעניקה לכם שליטה מלאה על המיקום והמבנה – אבל מה לגבי העיצוב? במדריך זה תלמדו כיצד לעקוף את עיצובי ברירת המחדל של HubSpot ולהחיל סגנונות CSS מותאמים [...]
CSS (גיליונות סגנון מדורגים – Cascading Style Sheets) היא השפה ששולטת במראה של אתרי אינטרנט. בעוד ש-HTML מגדיר את המבנה והתוכן של עמוד, CSS אחראית על כל מה שוויזואלי – צבעים, גופנים, מרווחים, פריסות ואנימציות. במדריך זה אלווה אתכם דרך [...]
ניתן לומר ש- CSS Nesting הוא סוג של מהפכה באופן בו מפתחים כותבים CSS בכך שהוא מאפשר לכללי CSS לשקף ישירות את המבנה ההיררכי של HTML. לא רק שהשימוש ב CSS Nesting משפר את קריאות הקוד, אלא גם מאפשר תחזוקה [...]
התכונה text-wrap ב- CSS מספקת דרך לשלוט באופן בו הטקסט נשבר בתוך קונטיינר. בעוד שבדרך כלל שבירת הטקסט מתבססת על חוקים בסיסיים, ערכים חדשים כמו pretty ו-balance מאפשרים אפשרויות מתקדמות יותר לטיפוגרפיה מאוזנת וקריאה יותר. בפוסט זה נבחן כיצד ערכים [...]
כאדם שמנהל אתר המספק תוכן בשפות הנכתבות משמאל לימין (LTR) ומימין לשמאל (RTL), אני לא יכול לתאר עד כמה התרגשתי כשגיליתי את תכונות ה-CSS הלוגיות (בלעז CSS Logical Properties). השימוש ב-Logical Properties שינה את הדרך שבה אני ניגש לעיצוב layout, [...]
הפונקציה repeat() ב-CSS Grid חוסכת לכם כתיבה חוזרת של ערכים. אני משתמש בה כמעט בכל גריד שאני בונה – ברגע שמכירים אותה, קשה לחזור לכתיבת 1fr 1fr 1fr 1fr ידנית. בואו נראה כיצד repeat() עובדת, כולל auto-fill, auto-fit, שילוב עם [...]