بعد تعلم أساسيات html و css وتصميم المواقع نظريا وتطبيقيا ، سيكون مفيدا لك مشاهدة هذه السلسلة الجديدة التي تحتوي على أمثلة وتطبيقات مناسبة كتدريب للمبتدئين ، هذه الدورة المفتوحة عبارة عن مجموعة من الفيديوهات وشرحت في كل فيديو تصميما خاصا .
تصميم لوجو بسيط ب html و css
استفتحت الدورة بهذا التصميم البسيط جدا لشعار لوجو فقط ب html و css فكرة يمكنك تطويرها للأفضل ، فبإمكانك دائما استخدام مخيلتك لتطوير أي فكرة وجعلها تبدو تطبيقيا أفضل من الفكرة الأصلية .
فيديو الدرس
تصميم قائمة منسدلة ب html و css
مرة أخرى فقط ب html و css صممنا قائمة منسدلة بكل سهولة ، فقط بتمرير الماوس أي عمل hover .
فيديو الدرس
تصميم فورم تسجيل الدخول ب html و css
صفحة تسجيل دخول بسيطة واحترافية في نفس الوقت .
فيديو الدرس
شرح عمل hover على الصورة بواسطة Rotate + Scale
تأثير جميل يمكنك عمله على الصور باستخدام خاصية transform التابعة ل css3 مع القيم scale و rotate .
فيديو الدرس
شرح عمل caption على الصورة تظهر مع تمرير الماوس باستخدام transition
فيديو الدرس
تغيير مظهر Scrollbar باستخدام خاصية جديدة في css
طريقة جديدة وخاصية جديدة لا تستخدم كثيرا بعد لتغيير شكل ولون مؤشر التصفح ، كونها لا تستخدم بكثرة لأنها غير مدعومة بعد من أغلب المتصفحات ، وشخصيا اشتغلت معي على جوجل كروم ، ولكن لا ضير من معرفتها وهناك بديل لها إضافة يمكنك تحميلها واستخدامها مشروحة على القناة وهذا رابط الفيديو : الرابط .
فيديو الدرس
تغيير مؤشر الماوس وإظهار صورة مكانه
إخفاء مؤشر الماوس وإظهار صورة مناسبة مكانه ، فكرة سألني عنها أحد أعضاء المجموعة على الفايسبوك لم تشتغل معه ولم يسبق لي القيام بها ، وكانت فرصة لتسجيل درس جديد .
فيديو الدرس
تصميم شكل الأوراق النصية الغير مرتبة والمسطرة باستخدام التدرج اللوني
كأنك تنظر إلى أوراق صفراء حقيقية مسطرة وغير مرتبة فقط ب html و css مع منح الزائر إمكانية مسح النص بالكامل وإعادة الكتابة تابع الدرس إلى النهاية .
فيديو الدرس