با استفاده از HTML5 و CSS3 یک قالب وب را پاسخگو کنید

Make a Web Template Responsive Using HTML5 & CSS3

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.

نمونه ویدیوها: (صرفا برای مشاهده نمونه ویدیو، ممکن هست نیاز به شکن داشته باشید.)

توضیحات دوره: آموزش ساخت یک قالب وب شگفت انگیز به یک قالب واکنش گرا فقط با استفاده از HTML و CSS آموزش تبدیل یک قالب وب غیر ریسپانسیو به یک قالب وب واکنش گرا مواجه شدن با مشکلات مختلف در طراحی قالب وب سازماندهی و اصلاح قوانین CSS چند نکته و ترفند در مورد OOCSS پیش از این نیازها:آشنا با HTML5 و CSS3 هر کامپیوتری: ویندوز، لینوکس یا مک یک مرورگر وب و یک ویرایشگر کد (VS Code ترجیح داده می شود)

به دوره آموزشی "Responsive Web Template Using HTML5 CSS3" خوش آمدید

در این دوره قصد داریم با هم یک قالب وبسایت آموزشی ریسپانسیو طراحی کنیم. اگر می خواهید بدانید که این الگو چگونه طراحی شده است، به دوره دیگر من در مورد این موضوع نگاهی بیندازید

در این دوره قصد داریم این قالب را که فقط با HTML و CSS طراحی شده است و در طراحی آن از جاوا اسکریپت استفاده نکرده ایم به صورت واکنش گرا بسازیم.

برای داشتن طراحی وب ریسپانسیو در این دوره در مورد:

صحبت خواهم کرد

از پرس و جوهای رسانه ای برای تعیین اندازه های مختلف دستگاه برای تعریف قوانین CSS استفاده کنید
نحوه استفاده از ابزارهای توسعه دهنده در مرورگرها برای طراحی واکنشگرا
تغییر اندازه تصاویر و فونت ها برای اندازه های مختلف صفحه
نحوه پنهان کردن موارد
تغییر چیدمان عناصر

علاوه بر این، با تعدادی چالش و مشکلات (مثلاً همپوشانی عناصر) روبرو خواهیم بود که در این دوره با هم بررسی و حل خواهیم کرد.

در پایان دوره، در مورد چگونگی بازسازی CSS، مرتب‌سازی قوانین تعریف‌شده، و همچنین CSS شی‌گرا (OOCSS) صحبت خواهیم کرد و نکاتی در مورد چگونگی بهبود قوانین CSS ارائه خواهیم داد.

اگر قبلاً با HTML و CSS آشنایی دارید، اما نمی‌دانید چگونه یک قالب واکنش‌گرا بسازید، توصیه می‌کنم این دوره را تماشا کنید.

سرفصل ها و درس ها