خرید گوشی اورجینال تصویر بنر
آموزش طراحی سایت

(وردپرس تم) | سرفصل های آموزش CSS

(وردپرس تم) | سرفصل های آموزش CSS

سرفصل‌های پست

  • 1 آموزش CSS به شکل جامع و کاربری – مقدمه
  • 2 برنامه مقالات آموزشی دوره CSS
    • 2.1 فصل اول – معرفی CSS
    • 2.2 فصل دوم – نحوه کد نویسی در CSS
    • 2.3 فصل سوم – فراخوانی کد CSS در HTML
    • 2.4 فصل چهارم – رنگ ها
    • 2.5 فصل پنجم – background در CSS
    • 2.6 فصل ششم – کادر ها در CSS
    • 2.7 فصل هفتم – ابعاد عناصر در CSS
    • 2.8 فصل هشتم – مدل جعبه ای
    • 2.9 فصل نهم – متن در CSS
    • 2.10 فصل دهم – فونت ها در CSS
    • 2.11 فصل یازدهم – استایل دهی به لینک ها
    • 2.12 فصل دوازدهم – جداول در CSS
    • 2.13 فصل سیزدهم – سایه در CSS
    • 2.14 فصل چهاردهم – position در CSS
    • 2.15 فصل پانزدهم – float در CSS
    • 2.16 فصل شانزدهم – display در CSS
    • 2.17 فصل هفدهم – طبقه بندی در CSS
    • 2.18 فصل هجدهم – overflow‌ در CSS
    • 2.19 فصل نوزدهم – گرادینت رنگ ها در CSS
    • 2.20 فصل بیستم – شفافیت در CSS
    • 2.21 فصل بیست و یکم – نشانه های ارتباطی در CSS
    • 2.22 فصل بیست و یک و نیم! – کامنت گذاری در CSS
    • 2.23 فصل بیست و دوم – شبه کلاس ها در CSS
    • 2.24 فصل بیست و سوم – شبه عناصر در CSS
    • 2.25 فصل بیست و چهارم – منو ها در CSS
    • 2.26 فصل بیست و پنجم – منو های بازشونده در CSS
    • 2.27 فصل بیست و ششم – گالری تصاویر در CSS
    • 2.28 فصل بیست و هفتم – انتخابگر صفات در CSS
    • 2.29 فصل بیست و هشتم – شمارنده ها در CSS
    • 2.30 فصل بیست و نهم – آیکون ها در CSS
    • 2.31 فصل سی‌ام – استایل دهی عناصر form در CSS
    • 2.32 فصل سی و یکم – حاشیه های عکس دار در CSS
    • 2.33 فصل سی و دوم – آموزش افکت های پیشرفته متن در CSS
    • 2.34 فصل سی و سوم – آموزش طراحی واکنش گرا در CSS
    • 2.35 فصل سی و چهارم – تبدیلات در CSS
    • 2.36 فصل سی و پنجم – آموزش transition در CSS
    • 2.37 فصل سی و ششم – آموزش Animation در CSS
    • 2.38 فصل سی و هفتم – آموزش Layout در CSS
  • 3 سوالات متداول

آموزش CSS به شکل جامع و کاربری – مقدمه

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

پادکست مقاله توسط نوید معدن نژاد

برنامه مقالات آموزشی دوره CSS

سرفصل های آموزش CSS

در این دوره آموزش CSS آنلاین و رایگان، کلیه مطالب آموزشی CSS طبق سرفصل های سازمان جهانی w3s به صورت گام به گام ارائه خواهد شد. روند مطالب آموزش طبق فهرستی که ارائه شده است خواهد بود و در هر مقاله آموزش html، یک بخش از فهرست در این صفحه درج خواهد شد. بدیهی است بخش هایی که هم اکنون مشاهده میکنید، سرفصل هایی است که طبق آن مسیر آموزش را طی میکنیم . پس با ما همراه باشید تا با قدم گذاشتن در دنیای CSS گامی بلند در مسیریاد گیری بردارید .

معرفی CSS

فصل اول – معرفی CSS

  • جلسه ۰۱ – CSS چیست و پیش نیاز های آن
  • جلسه ۰۲ – تاریخچه CSS
  • جلسه ۰۳ – فرق HTML و CSS

نحوه کد نویسی در CSS

فصل دوم – نحوه کد نویسی در CSS

  • جلسه ۰۴ – ساختمان کد در CSS و اجزای آن
  • جلسه ۰۵ – selector در CSS
  • جلسه ۰۶ – کلاس ها و آیدی ها در CSS
  • جلسه ۰۷ – انتخابگر های گروهی

فراخوانی کد CSS در HTML

فصل سوم – فراخوانی کد CSS در HTML

  • جلسه ۰۸ – اتصال خارجی (external stylesheet)
  • جلسه ۰۹ – اتصال داخلی (internal stylesheet)
  • جلسه ۱۰ – اتصال درون خطی (inline stylesheet) و اولویت تاثیرگذاری

فصل چهارم - رنگ ها

فصل چهارم – رنگ ها

  • جلسه ۱۱ – تعیین رنگ با استفاده از مقادیر پیش فرض و HEX
  • جلسه ۱۲ – تعیین رنگ با استفاده از ()rgb و ()hsl
  • جلسه ۱۳ – تعیین رنگ با استفاده از ()rgba و ()hsla

فصل پنجم - background در CSS

فصل پنجم – background در CSS

  • جلسه ۱۴ – استایل background در CSS
  • جلسه ۱۵ – مثال های بیشتر از background

فصل ششم - کادر ها در CSS

فصل ششم – کادر ها در CSS

  • جلسه ۱۶ – border ها در CSS
  • جلسه ۱۷ – outline ها در CSS
  • جلسه ۱۸ – padding ها در CSS
  • جلسه ۱۹ – margin ها در CSS
  • جلسه ۲۰ – تفاوت margin و padding و border و outline

فصل هفتم - ابعاد عناصر در CSS

فصل هفتم – ابعاد عناصر در CSS

  • جلسه ۲۱ – طول و عرض در CSS
  • جلسه ۲۲ – حداقل و حداکثر طول و عرض در CSS
  • جلسه ۲۳ – واحد ها در CSS

فصل هشتم - مدل جعبه ای

فصل هشتم – مدل جعبه ای

  • جلسه ۲۴ – مدل جعبه ای در CSS

فصل نهم - متن در CSS

فصل نهم – متن در CSS

  • جلسه ۲۵ – استایل دهی به متن
  • جلسه ۲۶ – چپ، راست و وسط چینی عناصر متنی در CSS
  • جلسه ۲۷ – تبدیلات متن

فصل دهم - فونت ها در CSS

فصل دهم – فونت ها در CSS

  • جلسه ۲۸ – فراخوانی فونت ها در CSS
  • جلسه ۲۸.۵ – استایل Font در CSS
  • جلسه ۲۹ – وزن و استایل فونت ها در CSS

فصل یازدهم - استایل دهی به لینک ها

فصل یازدهم – استایل دهی به لینک ها

  • جلسه ۳۰ – حالت های ممکن برای لینک ها (hover، active و …)
  • جلسه ۳۰.۵ – استایل لینک ها در CSS
  • جلسه ۳۱ – لینک ها به صورت دکمه ها (مقدمه ای از buttons)

فصل دوازدهم - جداول در CSS

فصل دوازدهم – جداول در CSS

  • جلسه ۳۲ – استایل Tables در CSS (قدیمی)
  • جلسه ۳۲ – استایل دهی به جداول در CSS
  • جلسه ۳۳ – استایل های پیشرفته جداول در CSS

فصل سیزدهم - سایه در CSS

فصل سیزدهم – سایه در CSS

  • جلسه ۳۴ – دستورات مبتدی shadow
  • جلسه ۳۵ – دستورات پیشرفته shadow
  • جلسه ۳۶ – مثال های باحال تر و کارت های زیبا با استفاده از shadow

فصل چهاردهم - position در CSS

فصل چهاردهم – position در CSS

  • جلسه ۳۷ – خاصیت position در CSS

فصل پانزدهم - float در CSS

فصل پانزدهم – float در CSS

  • جلسه ۳۸ – خاصیت float در CSS

فصل شانزدهم - display در CSS

فصل شانزدهم – display در CSS

  • جلسه ۳۹ – مفاهیم inline و block
  • جلسه ۴۰ – خاصیت display

فصل هفدهم - طبقه بندی در CSS

فصل هفدهم – طبقه بندی در CSS

  • جلسه ۴۱ – طبقه بندی به روش flexbox
  • جلسه ۴۲ – طبقه بندی به روش grid
  • جلسه ۴۳ – مقایسه flexbox و grid

فصل هجدهم - overflow‌ در CSS

فصل هجدهم – overflow‌ در CSS

  • جلسه ۴۴ – خاصیت overflow در CSS

فصل نوزدهم - گرادینت رنگ ها در CSS

فصل نوزدهم – گرادینت رنگ ها در CSS

  • جلسه ۴۵ – linear-gradient در CSS
  • جلسه ۴۶ – radial-gradient در CSS

فصل بیستم - شفافیت در CSS

فصل بیستم – شفافیت در CSS

  • جلسه ۴۷ – opacity در CSS

فصل بیست و یکم - نشانه های ارتباطی در CSS

فصل بیست و یکم – نشانه های ارتباطی در CSS

  • جلسه ۴۸ – combinator ها در CSS

فصل بیست و یک و نیم! - کامنت گذاری در CSS

فصل بیست و یک و نیم! – کامنت گذاری در CSS

  • جلسه ۴۹ – کامنت گذاری در CSS

فصل بیست و دوم - شبه کلاس ها در CSS

فصل بیست و دوم – شبه کلاس ها در CSS

  • جلسه ۵۰ – شبه کلاس های مربوط به input
  • جلسه ۵۱ – شبه کلاس های موقعیت محور
  • جلسه ۵۲ – شبه کلاس های ارتباطی

فصل بیست و سوم - شبه عناصر در CSS

فصل بیست و سوم – شبه عناصر در CSS

  • جلسه ۵۳ – شبه عناصر در CSS

فصل بیست و چهارم - منو ها در CSS

فصل بیست و چهارم – منو ها در CSS

  • جلسه ۵۴ – منو های عمودی در CSS
  • جلسه ۵۵ – منو های افقی در CSS
  • جلسه ۵۶ – ویژگی های پیشرفته تر منو ها

فصل بیست و پنجم - منو های بازشونده در CSS

فصل بیست و پنجم – منو های بازشونده در CSS

  • جلسه ۵۷ – منو های بازشونده در CSS

فصل بیست و ششم - گالری تصاویر در CSS

فصل بیست و ششم – گالری تصاویر در CSS

  • جلسه ۵۸ – گالری تصاویر در CSS

فصل بیست و هفتم - انتخابگر صفات در CSS

فصل بیست و هفتم – انتخابگر صفات در CSS

  • جلسه ۵۹ – انتخابگر صفت [attr] در CSS
  • جلسه ۶۰ – انتخابگر صفت [“attr=”value] در CSS
  • جلسه ۶۱ – انتخابگر صفت ‍‍~ در CSS
  • جلسه ۶۲ – انتخابگر صفات | و ^ در CSS
  • جلسه ۶۳ – انتخابگر صفات * و $ در CSS

فصل بیست و هشتم - شمارنده ها در CSS

فصل بیست و هشتم – شمارنده ها در CSS

  • جلسه ۶۴ – شمارنده ها در CSS

فصل بیست و نهم - آیکون ها در CSS

فصل بیست و نهم – آیکون ها در CSS

  • جلسه ۶۵ – آیکون ها در CSS

فصل سی‌ام - استایل دهی عناصر form در CSS

فصل سی‌ام – استایل دهی عناصر form در CSS

  • جلسه ۶۶ – استایل دهی به فرم ها در CSS
  • جلسه ۶۷ – مثال های بیشتر از فرم ها در CSS

فصل سی و یکم - حاشیه های عکس دار در CSS

فصل سی و یکم – حاشیه های عکس دار در CSS

  • جلسه ۶۸ – حاشیه های عکس دار در CSS

فصل سی و دوم - آموزش افکت های پیشرفته متن در CSS

فصل سی و دوم – آموزش افکت های پیشرفته متن در CSS

  • جلسه ۶۹ – افکت های پیشرفته متن در CSS

فصل سی و سوم - آموزش طراحی واکنش گرا در CSS

فصل سی و سوم – آموزش طراحی واکنش گرا در CSS

  • جلسه ۷۰ – مفهوم طراحی واکنش گرا
  • جلسه ۷۱ – مدیا کوئری در CSS
  • جلسه ۷۲ – واکنش گرایی و ابعاد عناصر
  • جلسه ۷۳ – روش ها و متد های طراحی واکنش گرا

فصل سی و چهارم - تبدیلات در CSS

فصل سی و چهارم – تبدیلات در CSS

  • جلسه ۷۴ – تبدیلات دو بعدی در CSS
  • جلسه ۷۵ – تبدیلات سه بعدی در CSS

فصل سی و پنجم - آموزش transition در CSS

فصل سی و پنجم – آموزش transition در CSS

  • جلسه ۷۶ – transition در CSS

فصل سی و ششم - آموزش Animation در CSS

فصل سی و ششم – آموزش Animation در CSS

  • جلسه ۷۷ – آشنایی با انیمیشن ها در CSS
  • جلسه ۷۸ – مثال های بیشتر از انیمیشن ها

فصل سی و هفتم - آموزش Layout در CSS

فصل سی و هفتم – آموزش Layout در CSS

  • جلسه ۷۹ – آشنایی با Layout ها در CSS

سوالات متداول



سی اس اس چیست؟

سی اس اس یک زبان کدنویسیه که برای استایل دهی به صفحات وب به کار میره. توسط سی اس اس می‌تونین صفحتون رو از ساختار خشک اچ تی ام ال تنها، به ساختار جذاب اچ تی ام ال و اس ام اس تغییر بدین.



سی اس اس چه نقشی در آینده شغلی به عنوان طراح وب داره؟

سی اس اس نقش بسیار مهمی رو در استایل دهی به صفحات بازی می‌کنه. با سی اس اس ، شما می‌تونین هر استایل و چهره ای که تو ذهن خودتون یا تو ذهن کارفرما هست رو به صفحه وب سایت بدین. یادگیری سی اس اس، برای توسعه دهنده های frontend از نون شب واجب تره و برای توسعه دهنده های backend، تا حد متوسطی کفایت می‌کنه.



پیشنیاز های یادگیری سی اس اس چیه؟

برای یادگیری سی اس اس ، باید به یک سری از مفاهیم اچ تی ام ال مثل روابط پدر فرزندی (parent and child)، و یک سری از تگ های مهم مثل div، p و img آشنایی کامل داشته باشین.



یادگیری سی اس اس چقدر طول می‌کشه؟

کاملا بستگی به نحوه یادگیری خودتون داره. بنابراین ما نمی‌تونیم زمان دقیقی برای یادگیری CSS ارائه بدیم. با این حال، تجربه ثابت کرده که تو ۲-۴ ماه میشه به تسلط خوبی از CSS رسید. اما از اون جایی که یادگیری “صددرصد” وجود نداره، میشه گفت یادگیری CSS هیچوقت به انتها نمی‌رسه 🙂



هزینه دوره سی اس اس میزفا چقدره؟

صفر. ما اینجا مقالاتی رو برای شما آماده کردیم که بتونین “کاملا رایگان” تا حد خوبی سی اس اس رو یاد بگیرین. در انتهای برخی از مقالات هم کوییز های کوچیکی برای شما تدارک دیده شده که بتونین خودتون رو بسنجین و مطمئن بشین که مبحث مورد انتظار رو به خوبی یاد گرفتین.

(وردپرس تم) | سرفصل های آموزش CSS

لینک منبع

هیچ کالایی را بدون تخفیف نخرید تصویر بنر

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

دکمه بازگشت به بالا