فیلم آموزش CSS مهندس رحمانی

در خدمت شما دوستان عزیز هستیم با فیلم آموزش CSS مهندس رحمانی از وب سایت آموزش برنامه نویسی سورس باران. در این دوره شما دوستان عزیز با CSS و CSS3 بصورت کامل آشنا خواهید شد. لیست سرفصل+دمو در ادامه مطلب. با ما همراه باشید…

فیلم آموزش CSS مهندس رحمانی

در این دوره آموزش کامل CSS و CSS3 از صفر، مدرس ابتدا شما دوستان را با مقدمات CSS آشنا می کنید و در ادامه دستورات پیشرفته و کاربردی تر را تدریس خواهد نمود.

[alert color=”red” icon=””]

دوستان و کاربران عزیز توجه داشته باشید که این دوره آموزش Html قبلا در سایت بصورت تک جلسه ای منتشر شده است و در این مطلب بصورت یکجا قرار داده شده است. اگر قبلا این دوره را دانلود نمودید نیازی به دانلود مجدد آن نیست.

[/alert]

 

CSS چیست؟

به تعبیر تخصصی‌تر، CSS یک زبان برنامه نویسی ظاهری (Style Sheet Language) است که برای ارائه زیباتر و قابل فهم‌تر یک سند (Document) نوشته شده به زبان نشانه گذاری یاMarkup Language به کار برده می‌شود. سی اس اس در کنار HTML قرار می‌گیرد تا هسته ایجاد یک وب سایت را به وجود بیاورند. برای طراح سایت، استفاده از CSS بهترین و سریع‌ترین راه شکل و شمایل دادن و ایجاد حس مناسب برای یک وب سایت است. برگه‌های CSS در واقع مسئولیت ایجاد ظاهر سایت را به عهده دارند و رنگ، اندازه و محل قرارگیری متن و دیگر تگ‌های HTML را تعیین می‌کنند. مسئولیت برگه‌های HTML با همکاری فیلدهای HTML کامل می‌شود. در واقع این فیلدهای HTML هستند که تعیین می‌کنند محتوای کدها چیست و هر کدام باید چگونه سازماندهی شوند.

CSS نسخه‌های مختلفی دارد که به آن‌ها Level گفته می‌شود، هر کدام از این نسخه‌ها هم به تنهایی دارای نسخه‌های تکمیلی دیگر هستند که به آن‌ها Profile گفته می‌شود. طبیعتا هر نسخه CSS بر اساس نسخه دیگر توسعه پیدا کرده و در نسخه‌های جدید قابلیت‌های جدیدتری اضافه شده است. هر Profile در CSS هم برای توسعه این زبان Style Sheet به یک دستگاه یا منظور خاص طراحی شده است.

حتما بخوانید : فیلم آموزش Html و Html5 مهندس رحمانی

حتما بخوانید : پکیج طلایی برنامه نویسی- 13 پکیج برنامه نویسی موبایل، ویندوز و وب

در زیر نمونه کد CSS را مشاهده می نمایید :

پیشنمایش

 

جلسه 1 فیلم آموزش Css و Css3

• دلیل پیدایش و اهمیت استفاده از Css
• اهمیت جداسازی محتوا از Css
• آموزش Syntax یا نحوه زبان Css
• شیوه کامنت یا Comment گذاشتن در Css
• دادن style به element ها بر اساس نام آنها در Css
• دادن استایل به عناصر Html توسط بر اساس selector آی دی id
• دادن استایل به عناصر Html توسط بر اساس selector نام کلاس یا class

 

 

 

 

لینک دانلود جلسه 1

 

جلسه 2 فیلم آموزش Css و Css3

• مرور جلسه گذشته
• معرفی ویرایشگر ها و IDE های مناسب برای ویرایش و اجاد فایل های Css
• آموزش شیوه گروه بندی Selctor ها در Css
• آموزش و یادآوری شیوه برخورد مرورگر با منابع external در فایل Html
• آموزش و یادآوری منابع external و internal و inline در Css
• آموزش خصیصه background-color در Css

 

 

 

 

لینک دانلود جلسه 2

 

جلسه 3 فیلم آموزش Css و Css3

• رور جلسه گذشته
• آموزش خصیصه background-color در سی اس اس یا Css
• آموزش خصیصه background-image در سی اس اس یا Css
• آموزش خصیصه background-image در سی اس اس یا Css
• آموزش مقدار background-image:no-repeat در سی اس اس یا Css
• آموزش مقدار background-image:repeat-x در سی اس اس یا
• آموزش مقدار background-image:repeat-y در سی اس اس یا Css
• آموزش خصیصه background-image در سی اس اس یا Css
• آموزش فرم کوتاه شده خصیصه background در سی اس اس یا Css
• آموزش خصیصه text-align در سی اس اس یا Css برای مقادیر right و left و center
• آموزش خصیصه direction در سی اس اس یا Css برای مقادیر rtl و ltr
• آموزش چگونگی رنگ دادن به کل سند Html

 

 

 

 

لینک دانلود جلسه 3

 

جلسه 4 فیلم آموزش Css و Css3

• آموزش خصیصه text-decoration و مقادیر none و line-through و underline برای آن در Css
• آموزش مفهوم generic family در سی اس اس
• آموزش مفهوم font-family در سی اس اس
• آموزش خصیصه font-family و شیوه صحیح استفاده از آن در Css

 

 

 

 

لینک دانلود جلسه 4

 

جلسه 5 فیلم آموزش Css و Css3

• آموزش font-style
• آموزش bold و italic و oblique در Css
• آموزش font-size
• آموزش مقیاس px و em
• آموزش شیوه دادن استایل به لینک ها و خواص link و hover و visited و active

 

 

 

 

لینک دانلود جلسه 5

 

جلسه 6 فیلم آموزش Css و Css3

• آموزش خاصیت text-decoration برای لینک ها
• آموزش خاصیت list-style برای لیست ها در Html

 

 

 

 

لینک دانلود جلسه 6

 

جلسه 7 فیلم آموزش Css و Css3

• آموزش خاصیت list-style برای ul
• آموزش خاصیت background برای li
• آموزش مقدار square برای list-style در ul
• آغاز آموزش دادن style به table ها

 

 

 

 

لینک دانلود جلسه 7

 

جلسه 8 فیلم آموزش Css و Css3

• آموزش خصیصه vertical-align برای table ها
• آموزش خصیصه border-collapse برای table ها
• آموزش مفهوم box model در CSS
• آموزش خصیصه های border و margin و padding در CSS

 

 

 

 

لینک دانلود جلسه 8

 

جلسه 9 فیلم آموزش Css و Css3

• شیوه محاسبه عرض و ارتفاع در مرورگرهای مختلف در Css
• چگونگی اصلاح شیوه محاسبه عرض و ارتفاع در مرورگرهای مختلف
• آموزش کار با خصیصه border-style و توضیح مقادیر dotted و dashed و solid و double و groove و ridge و inset و outset در برای آن در Css
• آموزش کارخصیصه border-width و border-color
• توضیح خصایص border-top و border-bottom و border-right و border-left
• استفاده ترکیبی از خصیصه border مانند border-style: dotted solid double dashed یا border: 5px solid red
• آموزش خصیصه outline
• آموزش خصیصه Margin و مقادیر auto و inherit

 

 

 

 

لینک دانلود جلسه 9

 

جلسه 10 فیلم آموزش Css و Css3

• آموزش تکمیلی خصیصه margin در CSS
• آموزش نوشتاری margin با یک تا چهار عدد در CSS
• آموزش خصیصه padding در CSS
• آموزش خصیصه min-width در CSS

 

 

 

 

لینک دانلود جلسه 10

 

جلسه 11 فیلم آموزش Css و Css3

• آموزش خصیصه های min-width و min-height در سی اس اس
• آموزش خصیصه های max-width و max-height در سی اس اس
• آموزش خصیصه های visibility و display و مقادیر none و visible و hidden و … در CSS
• آموزش سایر ابتدایی position و مقدار static و fixed برای آن در سی اس اس

 

 

 

 

لینک دانلود جلسه 11

 

جلسه 12 فیلم آموزش Css و Css3

• آموزش انواع positioning مثل static و fixed و relative و absolute
• آموزش خصیصه z-index
• شروع ساخت یک منوی افقی با استفاده از ul و li

 

 

 

 

لینک دانلود جلسه 12

 

جلسه 13 فیلم آموزش Css و Css3

• تکمیل ساخت یک منوی افقی با CSS
• آموزش خصیصه clear و مقادیر both و right و left برای آن در سی اس اس
• آموزش شیوه center یا در مرکز قرار دادن عنصر های block level با استفاده از margin:0 auto در CSS
• چپ گذاشتن یا راست گذاشتن عناصر با استفاده float یا position از نوع absolute
• آموزش انتخاب کننده های فضای خالی , + و < , ~ در سی اس اس

 

 

 

 

لینک دانلود جلسه 13

 

جلسه 14 فیلم آموزش Css و Css3

• آموزش Pseudo-class در Css مثل link و visited و hover و active و first-child
• آموزش pseudo-element در Css مثل first-line و first-letter و before و after و selection
• آموزش ابتدایی ساخت گالری عکس

 

 

 

 

لینک دانلود جلسه 14

 

جلسه 15 فیلم آموزش Css و Css3

• توضیحات تکمیلی در مورد آموزش ساخت یک گالری عکس با استفاده از CSS
• توضیح در مورد خصوصیت های opacity و filter در سی اس اس
• آموزش شیوه شفاف کردن یک عکس در CSS
• آموزش شیوه داشتن یک div شفاف در CSS

 

 

 

 

لینک دانلود جلسه 15

 

جلسه 16 فیلم آموزش Css و Css3

• مرور جلسه گذشته
• آموزش Sprite ها یا تصاویر زمینه ادغام شده در CSS
• آموزش مدیا تایپ print و screen در سی اس اس
• آموزش انتخاب گر attribute در سی اس اس
• آموزش انتخاب گر attribute در CSS با بکار بردن عملگر های = , | , * , ^ , ~

 

 

 

 

 

 

 

 

 

لینک دانلود جلسه 16

امیدوارم این مطلب مورد توجه دوستان عزیز قرار گفته باشد. همچنین از این لینک می توانید تمرین های زیادی از CSS رو انجام بدید.

راستی! برای دریافت مطالب جدید در کانال تلگرام یا پیج اینستاگرام سورس باران عضو شوید.