החלפת מדיה קוורי במיקסין פשוט

אחד הדברים הכי נוחים בשימוש ב Sass, הוא היכולת להשתמש במיקסינים (Mixins) – קטעי קוד שמוגדרים פעם אחת, ואפשר להוסיף אותם בכל מקום בו אתם זקוקים להם באמצעות פקודה פשוטה. תחשבו על כל מקטעי הקוד שאתם חוזרים עליהם לא מעט פעמים במהלך בניית האתרים שלכם, ותבינו כמה השימוש במיקסינים יכול להפוך את העבודה שלכם לפשוטה […]

התניה משולשת בג׳אווה סקריפט

התניה משולשת בג׳אווה סקריפט, או בלעז ternary operator, היא התניית פשוטה שיכולה לחסוך לכם שורות קוד מיותרות. הרעיון הוא כזה: אתם מציגים תנאי, תוצאה חיובית ואז שלילת. אם התנאי מתקיים, תקבלו את התוצאה החיובית, אם לא – את השלילית. מה יכול להיות יותר פשוט מזה? מן הסתם הרבה דברים, בעיקר כשלא רואים את הקוד. אז […]

הצגת תוכן בוורדפרס. או במילים אחרות: הלופ

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

איך משתמשים ב Container Query

אחד הכלים החזקים ביותר שנכנסו לשימוש ב css הוא ה Container Query, שנותן לנו אפשרות להגדיר את העיצוב שלנו בהתאם לגודל של חלק ספציפי בעמוד שלנו, ולא רק לפי הגודל של המסך. על מנת להשתמש בתכונה הזו, ראשית עלינו להגדיר את הקונטיינר. הקונטיינר יכול לקבל שתי תכונות: container-type ו- container-name. container-name כשמה כן היא. התכונה […]

איך דוחפים תוכן ב Flex box

יש כמה דרכים לשלוט במיקום התוכן ב Flex box, אבל אם רוצים לדחוף תוכן ספציפי, הדרך הפשוטה ביותר היא עם margin: auto. אם תסתכלו על הדוגמה הבאה: נוכל לסדר את התוכן כך: התוצאה שתתקבל במצב כזה, היא שתי קוביות שצמודות לצד שמאל של המסך, בעוד שהקוביה הימנית נצמדית לצד הימני. השיטה הזאת יעילה במיוחד כאשר […]

איך מקצצים טקסט אחרי מספר נתון של שורות?

מכירים את זה שאתם בונים אתר עם עיצוב מוקפד וגריד מדויק ברמת הפיקסל שנראה בדיוק לפי המוקאפ שקיבלתם מהמעצב, ואז הלקוח ממלא את אחד מהכרטיסים בעמוד הבית בטקסט ומתלונן על זה שהאתר לא נראה כמו בעיצוב שקיבלתם? בדיוק בשביל מקרים כאלה נועד line-clamp, שיודע לחתוך את הטקסט הנתון בתוך בלוק כלשהו אחרי מספר נתון של […]

1 2