(178 امتیاز از 37 رای)
Loading...
آموزش CSS | دوره مقدماتی
در این بخش دوره آموزش CSS به زبان ساده در قالب فیلم آموزشی را به فارسی و در سطح مقدماتی آماده کردیم به همراه سورس کد که در قالب 10 بخش و در 2.5 ساعت با کیفیت بالا تهیه شده است. کاربران در این آموزش CSS علاوه بر اینکه این زبان طراحی وب را فرا می گیرند، با نرم افزار PhpStorm نیز آشنا خواهند شد زیرا نرم افزار مورد استفاده در این طراحی PhpStorm است که یک برنامه قوی برای طراحی وب سایت می باشد. در ادامه به معرفی زبان CSS پرداخته و سرفصل های این فیلم آموزشی طراحی سایت همراه با بخش هایی از آموزش قرار گرفته است.
معرفی زبان CSS
به طور کلی یک صفحه وب شامل دو قسمت Client Side و Server Side می باشد. قسمت Client Side را می توانی به سه قسمت اساسی تفکیک نمود. ساختار صفحه اولین قسمت بوده که بوسیله زبان HTML ساخته می شود. شکل و شمایل و رنگ و لعاب صفحه دومین قسمت می باشد که در CSS مشخص می گردد و سوم قسمت نیز منطق برنامه در سمت کلاینت می باشد که با زبان های اسکریپتی همچون جاوا اسکریپت مشخص می گردد. از این رو یادگیری CSS برای طراحی وب حائز اهمیت می باشد.
استایل دهی صفحات وب با زبان CSS
در زبان برنامه نویسی HTML می توانیم اجزای صفحات وب را ایجاد نماییم، اما ضعف مهم زبان HTML عدم توانایی آن در ایجاد رابط کاربری است. به منظور ساخت رابط کاربری برای صفحات HTML ، زبان برنامه نویسی CSS که مخفیف شده Cascade Style Sheets می باشد، ایجاد شده است. زبان CSS یک مکمل برای زبان HTML بوده و سعی دارد تا خلاء ها و نقاط ضعف زبان HTML برطرف سازد. علاقمندان به طراحی صفحات وب با استفاده از زبان برنامه نویسی CSS می توانند قالب و استایل صفحات وب را یک بار طراحی نموده و در دفعات دلخواهی از آن استفاده نمایند.
برای مثال، در نظر بگیرید که یک وب سایت 150 صفحه ای را با استفاده از زبان HTML طراحی نموده اید. پس از مدتی قصد دارید تا در بعضی از خصوصیات سایت تغییرات جزئی را ایجاد نمائید مثلا بخواید پس زمینه کمی تیره تر باشد. انجام این موضوع در گفتار راحت به نظر می رسد اما در عمل کمی متفاوت تر خواهد بود. مطمئنا تغییر یک خط کد در تمام 150 صفحه ای که دارید بسیار زمان بر و دشوار خواهد بود.
اما در صورتی که زبان CSS را در طراحی وب سایت خود بکار بگیریم، تنها کافیست یک خط کد را در فایل CSS ویرایش کنیم تا تغییرات مدنظر در همه صفحات در همان لحظه اعمال گردد. در واقع صفحات HTML خود را به یک فایل CSS وصل می کنیم که با این کار قطعه کد های مربوطه از این فایل خوانده شده و اجرا می شوند. این عمل باعث خواهد شد تا کدنویسی کمتر و تمیز تری داشته باشیم.
فهرست سرفصل های دوره آموزش CSS
بخش اول: معرفی و آشنایی با CSS
- معرفی CSS
- ساختار دستورات CSS
- گزینشگر های CSS
- فایل CSS خارجی
بخش دوم: پس زمینه
- استایل دهی پس زمینه (background-image ، background-color و …)
بخش سوم: متن
- استایل دهی متن
بخش چهارم: فونت
- استایل دهی فونت
بخش پنجم: آشنایی با برخی مفاهیم و خاصیت ها در CSS
- مفهوم Box
- مفهوم طول و عرض
- خاصیت border
- خاصیت outline
- خاصیت margin
- خاصیت padding
بخش ششم: خاصیت float ،display ، position ، تراز بندی
- طریقه نمایش عناصر
- تنظیم موقعیت عناصر
- شناور کردن عنصر
- ترازبندی عناصر
بخش هفتم: آموزش لیست ها ، لینک ها ، جداول
- کار با لیست ها
- کار با لینک ها
- کار با جداول
بخش هشتم: گزینشگرها ، شبه کلاس ، شبه عناصر ، گزینش براساس صفت
- شبه کلاس‌ها
- شبه عناصر
- گزینش براساس صفت
بخش نهم: گالری تصویر ، شفاف سازی تصویر
- ساخت گالری تصاویر
- نحوه شفاف کردن تصویر
بخش دهم: طراحی واکنشگرا (طراحی واکنشگرای با CSS
- رسانه‌های مختلف
- استفاده از میدان دید
- شبکه بندی
- مدیا کوئری در طراحی واکنش گرای CSS
- فریم ورک ها در طراحی واکنش گرا
سلام من آموزش CSS به صورت مقدماتی رو از سایت شما خریدم و خیلی هم خوب بود حالا می خوام به صورت حرفه ایی زبان CSS رو یاد بگیریم یعنی برای طراحی سایت. آیا تو سایت شما آموزشی مثل این وجود داره که مباحث پیشرفته رو آموزش بده؟ یا حداقل آموزش طراحی سایت
به زودی دوره آموزش پیشرفته css رو در سایت قرار خواهیم داد که مباحث پیشرفته رو داخل آموزش خواهیم داد
سلام یه فیلم آموزشی در مورد css3 می خواستم کتابشو تو سایتتون دیدم ولی فیلمشو پیدا نکردم آیا امکانش براتون هست که اونم بزارید.
همین بخشی که نظر دادین خودش آموزش CSS هست و می تونید تهیه کنید
سلام تو این دوره آموزش CSS آیا به مباحث انیمشین در css هم پرداخته می شود؟ چون تو سر فصل های دور در مورد انیمیشن ها چیزی ندیدم.
توی دوره آموزش CSS پیشرفته بخش انیمشن ها رو هم آموزش خواهیم داد
سلام خدمت استاد عزیز یکی دد تا ایراد میخواستم بگیرم اول اینکه محیط کد نویسیتون خیلی گنک و تو در تو هستش بهتر بود از ide بهتری مثل ویژوال استیدو یا اتم یا بهتر و سبک از اینها ساب لایم رو استفاده کنید و ایراد دیگه اینه شما پشت بند اینا دوره پیشرفته و پرژه محور رو یاد بگیره که کاربر بدونه که کار اموز بدونه اینا رو کجا و به چه شکلی استفاده کنه و مورد سوم اینکه برای خودتو هم کسب در امد بهتری میشه ، لطفا و خواهشن کلاس اقای رامین ابراهیمی رو پایین نیارین حیف این سایت با داشتن همچین استاد قدری اینقدر بعضی چیزهارو ضعیف کار کنه انشالله که video های بعد بهتر از اینا باشه