סטודנטים/ות יקרים/ות!

הפוסט הנ"ל הינו סיכום קצר של השיעור בנקודות + מכיל את הקבצים שתורגלו בכיתה במהלך השיעור.
אם החומר לא מובן, אפשר לשלוח לי מייל או להתקשר : 050-555-6693 (אשתדל לענות, אם לא שלחו SMS ואחזור אליכם)

זכרו כי המפתח להצלחה הינו תרגול

שיעור 8 – פיתוח מתקדם באמצעות LESS + פיתוח רספונסיבי

קבצי עזר לפיתוח הפרויקט של שיעורי הבית שלום לכולם,

השיעור למדנו לעבוד עם LESS, ולשלב בתוך קוד ה CSS שלנו משתנים, פונקציות, תנאים ועוד..

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

 

שיעורי בית:

בנו אתר אינטרנט על פי המבנה הבא :

עבור מסך מחשב:

עבור מסך של טלפון נייד:

 

שימו לב שלכל הגדלים שבינהם (טאבלטים למשל)  לא קיבלתם עיצוב ולא חייב להתייחס לגדלים אלה.

גדלים מומלצים :

@media (min-width:320px)  { /* smartphones, portrait iPhone, portrait 480x320 phones (Android) */ }
@media (min-width:480px)  { /* smartphones, Android phones, landscape iPhone */ }
@media (min-width:600px)  { /* portrait tablets, portrait iPad, e-readers (Nook/Kindle), landscape 800x480 phones (Android) */ }
@media (min-width:801px)  { /* tablet, landscape iPad, lo-res laptops ands desktops */ }
@media (min-width:1025px) { /* big landscape tablets, laptops, and desktops */ }
@media (min-width:1281px) { /* hi-res laptops and desktops */ }

(לינק למקור)

 

קבצי עזר לפיתוח הפרויקט של שיעורי הבית

קבצי השיעור להורדה

 

סגירת תפריט