آموزش مقدماتی CSS3
با یادگیری فرانت اند ایده ها خود را زنده کنید
با تدریس مهندس مهدی زبردست برزین
359 مگ
3:22 ساعت
15 جلسه
1 سال پشتیبانی
100 درصد رایگان همراه با ضمانت یادگیری
CSS یک زبان فرانت اند (Front End) می باشد
فرانت اند (Front End) به مجموعه ای از کارهایی گفته می شود که بر روی گرافیک و شکل ظاهری سایت تاثیر دارد و با عملکرد سایت کاری ندارد. از جمله زبان هایی که فرانت اند هستند می توان به CSS، HTML، JAVASCRIPT اشاره کرد.
CSS یکی از پرکاربردترین زبانها در زمینه طراحی فرانت اند است. به مجموعه تکنولوژی هایی که روی ظاهر و گرافیک سایت تاثیر گذاشته و هیچ ارتباطی با عملکرد آن ندارند فرانت اند گفته میشود. در فرانت اند فقط با عناصر بصری سایت کار میکنیم و هر تغییری که ایجاد میکنیم در چهره سایت مشخص میشود. زبانهای HTML، JS و CSS جزو اصلیترین عناصر فرانت اند هستند.
اساسیترین کاربرد CSS، زیبا سازی و بهبود طراحی صفحات وب است. CSS بسیار منعطفتر از HTML است و به شما اجازه میدهد برای تغییر صفحات وب، کمتر سراغ ساختار HTML رفته و با سرعت بیشتری طراحی خود را خوش استیل کنید.
HTML و CSS هیچکدام به تنهایی هیچ مزیت خاصی ندارد. با HTML به تنهایی نمیتوانید صفحات وب حرفهای و چشم نواز طراحی کنید. CSS هم به تنهایی کاربردی نمیتواند داشته باشد. HTML و CSS در کنار یکدیگر هستند که میتوانند قدرت فوق العادهای پیدا کنند و صفحات وب چشم نواز و زیبایی را طراحی کنند.
CSS هرگز نمیتواند یک زبان برنامه نویسی باشد. زیرا اصلا ویژگی های یک زبان برنامه نویسی، مثل متغیر ها، توابع، شرط ها، حلقه ها و… را ندارد. پس کاملا اشتباه است اگرCSS را یک زبان برنامه نویسی بدانیم. میتوانیم دربارهیCSS بگوییم که ابزاری است که استفاده از آن میتوانیم تگ های HTML خود را زیبا کنیم و صفحات وب چشم نوازی را طراحی کنیم.
CSSیک زبان برای ساخت شیوه نامه است که از آن برای توصیف نمایش یک سند (که به یکی از زبانهای نشانهگذاری مثل اچتیامال نوشته شدهاست) استفاده میشود. سیاساس یکی از فناوریهای بنیادین (در کنار اچتیامال و جاوااسکریپت) در وب جهانگستر است.
در بحث طراحی با استانداردهای وب، همهٔ ساختار گرافیکی و تصویری صفحههای وب باید توسط دستورات سیاساس مجزا تعیین شود و لابهلای صفحههای وب نباید دستورهایی برای درج چگونگی نمایش آنها نوشته شود. به بیانی دیگر، نشانهگذاری یک صفحهٔ وب (کدهای html) و دستورات مربوط به گرافیک آن (دستورات css) باید کاملاً از یکدیگر جدا باشند.
CSS3 آخرین و بزرگترین بروزرسانی CSS تاکنون بودهاست. در حال حاضر CSS3 نسخه آخر CSS است ولی بر اساس Level بالا میرود. ولی شماره نسخه تغییری نمی کند.
هدف و کاربرد css
هدف از تولید css در واقع جداسازی اطلاعات محتوا (که توسط زبانی مانند HTML نوشته شده اند) از اطلاعات ظاهری مانند صفحه بندی، رنگ و سایز و نوع فونت می باشد. این جداسازی موجب افزایش سرعت در دسترسی به سایت، انعطاف پذیری بیشتر برای کنترل ویژگی های ظاهری، قابلیت طراحی چندین صفحه با یک فرمت یکسان و جلوگیری از پیچیدگی و انجام کارهای تکراری در طراحی وب سایت می گردد.
برخی از کاربردهای CSS
- تعیین ارتفاع و عرض
- طراحی سایت رسپانسیو صفحات
- انتخاب پس زمینه
- انتخاب محل قرار گرفتن یک عنصر مانند متن یا عکس و…
- تعیین چیدمان نوشته ها (چپ چین، راست چین و…)
- مشخص کردن میزان فاصله ی عناصر از همدیگر
- تغییر در نوع نوشتاری (فونت، رنگ و…)
مزایای CSS3
- سازگاری بیشتر در طراحی
- گزینه های قالب بندی بیشتر
- کد سبک
- بارگیری سریعتر
- بهینه سازی موتور جستجو
- دسترسی بهتر به کد
محدودیت های زبان CSS
- کنترل ضعیف صفحه بندی های قابل انعطاف
- عدم امکان انتخاب گزینه های والد
- محدودیت در کنترل فرم های عمودی
- عدم وجود توضیحات لازم در زبان css
- بروز مشکلاتی در ساخت ستون ها
این دوره برای چه کسانی مناسـب اسـت؟
- کسانی که به دنبال تسریع فرایند توسعه سایت هستند.
- کسانی که به دنبال یادگیری یک زبان نشانه گذاری فرامتن هستند.
- کسانی که علاقهمندبه ارتقای فنی و درآمدی هستند.
این دوره برای چه کسانی مناسـب نیست؟
- کسانی که وقت کافی برای انجام تمرینات را ندارند
- کسانی که مایل به ارتقای سطح فنی خود در توسعه فرانت اند نیستند
ویژگی های دوره
ما به کیفیت و اثربخشی محصول خود اعتقاد داریم و به همین منظور گارانتی بازگشت وجه یک ماهه به شما ارائه می دهیم تا خریدی بدون ریسک و بدون نگرانی داشته باشید.
هزینهای که بابت دوره پرداخت میکنید تا 1 ماه در اختیار خودِ شماست. اگر پس از خرید دوره بهصورت جامع، به هر دلیلی از شرکت در آن منصرف شدید تا ١ ماه پس از خريد امكان انصراف و بازگشت كامل وجه برای شما درنظر گرفته شده است. برای انصراف از دوره لازم است در بازه زمانی تعیین شده درخواست خود را با پشتیبانی مطرح کرده و حداکثر ۲۵% از دوره را مشاهده کرده باشید و با توجه به سرفصل های اعلام شده و توضیحات دوره مغایرت تعهدات و ویدئو های آموزشی را مطرح نمایید، بدیهی می باشد پس از بررسی توسط تیم کارشناسی مدرسه ما، درصورت صحت ادعای شما و اثبات مغایرت احتمالی هزینه به صورت کامل عودت داده خواهد شد. پس از انصراف همواره منتظر نظرات و پیشنهادات شما برای بهبود کیفیت دوره و نحوه ارائه آنها هستیم و امیدواریم در حوزه موردنظر خود به موفقیت و فرصتهای بزرگی دست پیدا کنید.
آموزش مهارتمحور به این معنیست که در طول دوره و باتوجه به میزان پیچیدگی هر مبحث آموزشی تمرین، آزمون و پروژههای مختلفی برای شما در نظر گرفته شده است تا یادگیری خود را تکمیل کنید. همچنین برگزاری وبینارهای متعدد و عضویت در گروه دوره امکان ارتباط با اساتید، منتورها و سایر دانشجویان را برای شما فراهم میکند. وضعیت آموزشی هر دانشجو برای منتورهای دوره قابل رصد و ارزیابیست زیرا منتورها از بین دانشجویان برتر انتخاب شدهاند و بهخوبی با فرایند آموزشی و چالشهای دوره آشنایی دارند. پایبندی به این متد آموزشی علاوهبر ارتقا سطح مهارتی که دارید، شما را با چالش هاى فنى و نحوه مدیریت آنها آشنا مى كند و اين همان چيزىست كه برای حضور در بازار كار به آن نياز داريد.
مزیت دوره های مدرسه ما در ارتباط مستقیم دانشجو با استاد می باشد، به صورتی که دانشجو توسط شبکه های مجازی و یا ایمیل مدرسه ما می تواند با مدرس در اتباط باشد و پاسخ سوالات خود را دریافت نماید.
بدیهی می باشد با توجه به تعداد دانشجویان دوره پاسخگویی کمی زمان بر خواهد بود و علاوه بر آن هنگام طرح سوال بایستی عدالت در پشتیبانی را در نظر گرفته و از طرح سوالاتی که نیاز به پاسخ های طولانی دارند خوداری نمایید.
درصورتی که تمایل به دریافت مدرک مدرسه ما – واحد فرهنگی نشر دیجیتال داشته باشید، بعد از ثبت درخواست، از سوی تیم ارزیابی پروژه ای برای شما تعریف شده و پس از انجام پروژه و بررسی آن از سوی تیم ارزیابی در صورتی که حد نصاب نمره(70 از 100) را کسب کرده باشید، برای شما گواهی شرکت در دوره صادر خواهد شد.
مدرسه ما متعهد می باشد تا یک سال پس از خرید دوره به پشتیبانی خود از هنر آموزان دوره با توجه به شرایط و قوانینی که ذکر شد، بپردازد و در این راه هنر آموزان خود را تنها نگذارد.
مقایسه HTML با CSS و جاوا اسکریپت
با وجود اینکه HTML زبان قدرتمندی است، اما برای ساخت یک وبسایت حرفهای و کاملاً واکنشگرا کافی نیست. از زبان برنامه نویسی HTML (زبان نشانهگذاری HTML) تنها میتوان برای اضافه کردن عنصرهای متنی استفاده و ساختار محتوا را ایجاد کرد. اما، HTML به همراه دو زبان فرانتاند دیگر به خوبی کار میکند.
این زبانها CSS و جاوا اسکریپت هستند. با استفاده از CSS ، HTML و جاوا اسکریپت میتوان به تجربه کاربری بسیار خوبی دست یافت و قابلیتهای پیشرفتهای را پیادهسازی کرد.
CSS برای طراحی و استایلدهی مثل یک پسزمینه، رنگها، صفحه آرایی، فاصله گذاری و تصاویر متحرک استفاده میشود.
جاوا اسکریپت امکان افزودن قابلیتهای پویا همچون اسلايدرها، پاپآپها و گالری تصاویر را پدید میآورد.
میتوان کاربرهای اصلی hTML را شامل موارد زیر دانست:
- ساختاردهی محتوا: HTML برای ساختاردهی و نمایش محتوای وبسایت استفاده میشود. با استفاده از عناصر HTML مختلف، میتوانید ساختار صفحات وب را تعریف کنید، مثلاً سرصفحه (header)، فوتر (footer)، ناوبری (navigation)، بخشهای مختلف صفحه و متنها.
- فرمها: HTML حاوی عناصر فرم است که به کاربران امکان میدهد اطلاعات را وارد کنند و آنها را به سمت سرور ارسال کنند. این عناصر شامل فیلدهای متنی، دکمهها، جعبه انتخاب، چکباکس، رادیوباتن و غیره هستند.
- لینکها: عناصر HTML مانند `<a>` برای ایجاد لینکها به صفحات دیگر یا منابع خارجی استفاده میشوند. با استفاده از لینکها، کاربران میتوانند به صفحات دیگر جابجا شوند و منابع را دریافت کنند.
- تصاویر: HTML امکان نمایش تصاویر در صفحات وب را فراهم میکند. عنصر `<img>` برای اضافه کردن تصاویر استفاده میشود و میتوانید مسیر تصویر و متن جایگزین (alt text) را مشخص کنید.
- جداول و قالببندی: با استفاده از عناصر HTML مانند `<table>` و `<div>`، میتوانید جداول و قالببندیهای مختلف را در صفحات وب ایجاد کنید. این امکان به شما کمک میکند تا طرح صفحه خود را طبق نیازهای خود سفارشی کنید.
- عناصر چندرسانهای: HTML امکان نمایش ویدیو، صدا، نقشهها و اجزای چندرسانهای دیگر را در صفحات وب فراهم میکند. با استفاده از عناصر HTML مختلف، میتوانید این اجزا را به صفحات خود اضافه کنید.
جلسات دوره
آموزش مقدماتی CSS3
Intro ویدئو
معرفی دوره
درس اول ویدئو
افزودن css به صفحات وب
درس دوم ویدئو
Selector in CSS
درس سوم ویدئو
Background
درس چهارم ویدئو
head & headings
درس پنجم ویدئو
Margin & Padding
درس ششم ویدئو
Height & width
درس هفتم ویدئو
رنگ و ترازبندی متون
درس هشتم ویدئو
Font in CSS
درس نهم ویدئو
فرمت دهی به لینک ها
درس دهم ویدئو
Table in CSS
درس یازدهم ویدئو
Display – block and inline
درس دوازدهم ویدئو
position
درس سیزدهم ویدئو
overflow
درس چهاردهم ویدئو
float & clear in CSS
پیوست فایل های ضمیمه
فایل های دوره
از چه کسی یاد میگیری؟
مهدی زبردست برزین
مدیر و موسس مدرسه ما
- مدیر و موسس مدرسه ما
- مدرس دانشگاه علمی و کاربردی از سال 93
- مدرس و معاون مدارس دولتی و غیر انتفاعی از سال 83
- مدرس آموزشگاه های فنی و حرفه ای از سال 96
- فریلنسر
دانشجویان دوره
نظرات تعدادی از دانشجویان دوره سی شارپ بر پایه w3schools
همین الان ثبت نام کن
0 میلیون پرداخت کامل با تخفیف ویژه 100 درصد
این فرصت استثنایی رو از دست نده!