נושאי השיעור

עבודה עם בוטסטראפ ברשת

עיגול פינות

צל

transition

חומרי עזר

מצגת CSS3

http://gamani.info/prog/HTML-CSS/lesson7/CSS.zip/

תרגילים הדגמה CSS3

http://gamani.info/prog/HTML-CSS/lesson7/css3-ex.zip/

מצגת transition

http://gamani.info/prog/HTML-CSS/lesson7/transform_transition_animation.zip/

תרגילים transition

http://gamani.info/prog/HTML-CSS/lesson7/transform-transition-ex.zip/

קישורים (ממתקים)

בוטסטראפ – ניתן להוריד את הקבצים מפה:

http://getbootstrap.com/

מי שרוצה ללמוד עוד על עבודה עם בוטסטראפ מוזמנת להציץ ב

https://www.net-tuts.co.il/

border radius generator

https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Background_and_Borders/Border-radius_generator

text shadow generator

http://www.webestools.com/css3-text-shadow-generator-css-property-shadows-on-texts-html5-drop-shadow-title-shadow-maker-text-shadow-h1.html

box shadow generator

http://html-css-js.com/css/generator/box-shadow/

תיקיית אפקטים במעבר עכבר

http://ianlunn.github.io/Hover/

שיעורי בית

צרו אנימציה באתר כך שבמעבר עכבר על תמונות הפרחים בדף הבית יופיע בהדרגה רקע שחור חצי שקוף

השתמשו בתכונות של צל ועיגול פינות

שלבו באתר שלכן אנימציה אחת במעבר עכבר מתוך האתר http://ianlunn.github.io/Hover/

פתרון שיעורי הבית נמצא פה

http://gamani.info/prog/HTML-CSS/lesson7/gananut-animation/

חזרה לעמוד הקורס