میتوانم شکست را بپذیرم اما تلاش نکردن را هرگز!
آموزش سی‌اس‌اس (CSS)
بعد از اینکه اسکلت بندی صفحه ی وب را با استفاده از عناصر HTML انجام دادیم، نوبت به رنگ و لعاب صفحه خواهد رسید. CSS زبانی برای نمایش هر چه بهتر اسناد HTML است. با استفاده از این زبان میتوانیم ظاهر یک سند HTML را تعیین کرده و برای تک تک عناصر HTML استایلی مناسب برگزید
CSS چیست؟
کدهای CSS دستوراتی است که توسط آنها میتوان تمامی خصوصیات ظاهری صفحه وب سایت را تعیین کرد. بنابراین شما توسط کدهای آسان HTML صفحه وب سایت خود را پیاده سازی میکنید و با دستورات آسان CSS مشخص میکنید هر عنصر چه خصوصیات ظاهری داشته باشد. خصوصیاتی مانند رنگ عنصر، اندازه هر عنصر، رنگ و غیره . CSS مخفف کلمه Cascading Style Sheets و به معنی شیوه نامه آبشاری است. علت این نامگذاری نحوه اعمال دستورات به عناصر موجود در صفحه است. شما برای اعمال دستورات CSS به عناصر HTML می بایست از بیرونی ترین عنصر به ترتیب به عناصر داخلی آن دسترسی پیدا کنید که تداعی کننده حالت آبشاری است که بعد از استفاده از دستورات متوجه این موضوع خواهید شد.
چرا باید از کدهای CSS استفاده کنیم؟
کدهای CSS میتواند در بسیاری از کارهای تکراری، زمان طراحی و حجم کدهای سایت صرفه جویی کند. شما میتوانید یکبار خصوصیات ظاهری عناصر را در وب سایت توسط کدهای CSS مشخص کنید، سپس هر کجا در وب سایت از عنصر مورد نظر استفاده کردید، خصوصیات مشخص شده را به آن عنصر اعمال کنید. خوب است بدانید گوگل در رتبه بندی وب سایت ها یعنی همان سئو، سرعت بارگذاری سایت و کیفیت کدها را نیز مدنظر قرار میدهد و وب سایت هایی را که سرعت بارگذاری آنها مناسب نباشد، کمتر به جستجو کنندگان معرفی خواهد کرد.
نکته: در گذشته طراحی سایت و چیدمان عناصر صفحات وب، از طریق جدول انجام می‌گرفت. جداول مشکلات زیادی داشتند و به این خاطر با ظهور CSS کاملا منسوخ شدند. از جمله مشکلات جداول میتوان به حجم بالای پردازش آنها توسط مرورگر و در نتیجه کاهش سرعت اشاره کرد. این ویژگی منفی وب سایت هایی است که با جدول پیاده سازی می شدند. در مقابل در وب سایتی که با کدهای CSS پیاده سازی شود، عناصر یکی پس از دیگری در هنگام بارگزاری بر روی صفحه پدیدار میشوند و کاربر از لحظه درخواست میتواند مشغول مطالعه و مشاهده وب سایت تا زمانی که بارگزاری کامل شود، باشد.
کدهای CSS را کجا بنویسیم؟
برای نوشتن کدهایCSS در یک وب سایت سه روش وجود دارد:
- External Style Sheet : شیوه نامه خارجی
- Internal Style Sheet : شیوه نامه داخلی
- Inline Style : شیوه درون خطی
-
CSS پایه
- CSS چیست؟
- چرا باید از CSS استفاده کنیم؟
- ساختار نحوی کدهای CSS
- id و Class در CSS
- دستورات CSS را کجا بنویسیم؟
-
استایل عناصر
- استایل پس زمینه ها
- استایل متن ها
- استایل فونت ها
- استایل لینک ها
- استایل لیست ها
- استایل جداول
-
ساختار و لایه بندی باکس ها
- حاشیه (Border)
- خطوط بیرونی (Outline)
- فاصله از لبه بیرونی باکس (Margin)
- فاصله از لبه داخلی باکس (Padding)
-
CSS پیشرفته
- گروهبندی و عناصر تودرتو (Grouping/Nesting)
- ابعاد عناصر (Dimension)
- نحوه نمایش عناصر (Display)
- موقعیت دهی به عناصر (Positioning)
- چیدمان عناصر شناور (Floating)
- چپ چین، راست چین و وسط چینی عناصر (Align)
- شبه کلاس ها (Pseudo-class)
- شبه عناصر (Pseudo-element)
- نوار منو افقی (Navigation Bar)
- گالری تصاویر (Image Gallery)
- شفافیت تصاویر (Image Opacity)
- انواع رسانه ها (Media Types)
- تکنیک نمایش تصاویر همجوار (Image Sprites)
- انتخاب عناصر توسط صفت (Attribute Selectors)
برای یادگیری CSS چه چیز را باید از قبل بدانیم !
قبل از اینکه مطالعه ی آموزش CSS (سی‌اس‌اس) را شروع کنید، شما باید دانش پایه ای(حداقلی) از موارد زیر را داشته باشید
واژگان کلیدی
موقعیت مکانی
