مقدمه ای بر SASS

به صفحه ی آموزشی تمپ ایران خوش آمدید

سعی ما براین است تا بهترین آموزش ها را برای شما کاربران فراهم کنیم

مقدمه ای بر SASS

 مقدمه ای بر SASS
  • نام آموزش: مقدمه ای بر SASS
  • نوع آموزش:PDF
  • حجم:1 Mb
  • قیمت:رایگان

توضیحات : SASS به ما کمک می کند تا فایل های پیچیده CSS را فشرده کنیم و به خوبی به آن ها ساختار دهیم. همچنین کمک می کند تا کد تکراری نزنیم و آن ها را حذف می کند البته اگر از SASS استفاده می کنید.

آموزش مقدماتی Sass

تاریخ انتشار : 1396/3/21

SASS چیست؟

SASS مخفف Syntactically Awesome Style Sheet است. زمانی که Stylesheet هایتان در حال پیچیده شدن و بزرگ تر شدن هستند،اینجا جایی است که SASS به کمکتان می آید و این مشکلات را حل می کند. SASS یک چارچوب (Framework) است که به توسعه دهندگان کمک می کند کد CSS شان را کاهش دهند.

چرا SASS؟

SASS به ما کمک می کند تا فایل های پیچیده CSS را فشرده کنیم و به خوبی به آن ها ساختار دهیم. همچنین کمک می کند تا کد تکراری نزنیم و آن ها را حذف می کند البته اگر از SASS استفاده می کنید.

موارد لازم برای آغاز SASS

ابتدا باید مقدمات کار با CSS را بدانید

دانش HTML را نیز داشته باشید

SASS عموما از دو نوع پشتیبانی می کند. آن ها SCSS و SASS هستند. تفاوت اصلی در براکت ها {} است و همچنین semicolon. جدول زیر را مشاهده کنید و تفاوت قواعد گرامری این دو نوع را مشاهده کنید.

آموزش مقدماتی sass

برای اینکه کد های فشرده داشته باشید، از پیش پردازش کدهایتان مایل به استفاده هستید، SASS از ویژگی هایی که در پایین گفته می شود پشتیبانی می کند:

1.

اولین چیزی که در ذهنتان می آید این است که درباره متغیر ها در C# یا جاوا اسکریپت و یا هر زبان برنامه نویسی دیگری، شنیده بودم! به همین خاطر ما از متغیرها برای تخصیص مقادیر CSS ای استفاده می کنیم. به عنوان مثال شما می توانید مقادیر رنگ ها و رشته رنگ ها و اعداد را در متغیر هایتان بریزید.

شما می توانید با استفاده از نماد $ یک متغیر تعریف کنید.

مثال: $body-color: red;

2.

XML / HTML یک وراثت عالی در کد نویسی دارند، جایی که کد ها تو در تو می شوند و باعث می شود تا ظاهر بهتری کدهایتان بگیرند. همچنین نگهداری آن نیز ساده می شود.

مثال زیر را نگاه کنید:

آموزش مقدماتی sass

3. زمانی که کد های CSS بزرگ تر می شود و زمانی که شما چیزی پیدا می کنید، با مشکلات زیادی مواجه می شوید. گاهی وقت ها، واقعا آزار دهنده می شوند و دست SASS درد نکنه که کار ما را ساده تر کرده است. شما به راحتی می توانید کدهایتان را ماژولار کنید و جایی که می خواهید از آن ها استفاده کنید.

فایل های ماژولار آیا کامپایل می شوند؟

خیر، به وسیله دیدن نماد "_" در جلوی نام فایل، کامپایلر از کامپایل آن ها منصرف می شود و آن ها را نادیده می گیرد و کد CSS تولید نمی کند.

Comment و import کردن:

SASS از توضیحات چند خطی بصورت (/* */) و تک خطی بصورت (//). زمانی که فایل کامپایل می شود یک نظر چند خطی می سازد سپس کد های کامپایل شده را در CSS قرار می دهد.

آموزش مقدماتی sass

مثال Import “_mainmenu”

Mixins

Mixin ها به شما اجازه می دهند تا قابلیت استفاده مجدد از پروژه را نیز داشته باشید. شما حتی می توانید مقادیر را به Mixin ها عبور دهد.

گسترش / وراثت

@extend به شما کمک می کند تا قابلیت استفاده مجدد از خواص CSS از انتخاب گر به یک انتخاب گر دیگر داشته باشید. همچنین کمک می کند که SASS باعث شود تا کد تکراری نزنید.

آموزش مقدماتی sass


تگها

 

نظرات درباره ی آموزش مقدماتی Sass

 

مطالب آموزشی دیگر

انجام یک پروژه MVC

تاریخ انتشار : 1396/3/30

در این مقاله قصد داریم به شرح یک پروژه بدنسازی در MVC بپردازیم که در این پروژه دو نوع کاربر داریم یک کاربر admin یا مدیر سایت و یک کاربر به عنوان user عادی ،که در فایل ضمیه ای که در انتها برای شما قرارداده ام کلمه عبور و نام کاربری برای وارد شدن به صفحه مدیریت و صفحه کاربری قابل مشاهده است.

ادامه مطلب

طراحی سایت با ASP.NET بهتر است یا PHP

تاریخ انتشار : 1396/3/29

طراحی سایت با ASP.NET بهتر است یا PHP - مقایسه PHP وASP.NET مقایسه زبان php و سکوی asp.net برای طراحی سایت بحثی طولانی و تمام نشدنی است.

ادامه مطلب

مقدمه ای بر SASS

تاریخ انتشار : 1396/3/21

SASS به ما کمک می کند تا فایل های پیچیده CSS را فشرده کنیم و به خوبی به آن ها ساختار دهیم. همچنین کمک می کند تا کد تکراری نزنیم و آن ها را حذف می کند البته اگر از SASS استفاده می کنید.

ادامه مطلب

برش و آپلود تصویر با Thumbnail با استفاده از jQuery و HTML5 در MVC

تاریخ انتشار : 1396/3/21

در این مقاله ما قصد داریم که با طرح یک مثال نحوه برش و آپلود تصویر با نمایش زنده Thumbnail با استفاده از jQuery و HTML5 Canvas در ASP.Net MVC توضیح دهیم.

ادامه مطلب

ساخت login form در ASP.Net با استفاده از #C

تاریخ انتشار : 1396/3/20

در این مقاله میخواهیم نحوه ساخت یک Login Form ساده را در ASP.Net با استفاده از C# شرح دهیم .

ادامه مطلب

برنامه ارسال ایمیل به چند آدرس ایمیل با ASP.NET

تاریخ انتشار : 1396/3/12

در این پست خواهیم دید که چگونه یک ایمیل را به چند آدرس ایمیل به همراه فایل ضمیمه در ASP.NET ارسال کنیم.

ادامه مطلب

آموزش مبتدی SEO

تاریخ انتشار : 1396/3/12

در این مقاله قصد داریم شما را با محتوای Seo و نکاتی که در آن میتواند سایت شما را در رده ی بالاتری در موتورهای جستجو قراردهد،آشنا کنیم.

ادامه مطلب

ساخت ربات تلگرام با php

تاریخ انتشار : 1396/3/5

ربات تلگرام ابزاری است اهداف تجاری، خدماتی، امنیتی، تفریحی و آموزشی. در این سلسله آموزش علاوه بر آشنایی با ربات تلگرام یاد می‌گیریم چگونه با زبان قدرتمند php یک ربات هوشمند تلگرام راه اندازی کنیم.

ادامه مطلب

ساخت ربات تلگرام با C#

تاریخ انتشار : 1396/3/4

تلگرام از محبوب ترین مسنجر ها یا ابزار پیام رسانی برای دستگاه های هوشمند هستند ، چند وقتی است ربات ها در تلگرام محبوبیت زیادی را بدست آورده اند در این مقاله نیز با نحوه استفاده از آن ها در C# و مدیریت این ربات ها که به وسیله Api ها مدیریت می شوند آشنا خواهیم شد .

ادامه مطلب

آموزش asp.net MVC5

تاریخ انتشار : 1395/11/20

در این سری آموزشی می خواهیم MVC 5 را به صورت گام به گام در ۷ روز آموزش دهیم.همانطور که در عنوان مقاله به شما قول دادیم، MVC را در ۷ روز یاد بگیرید. بنابراین این سری آموزشی ۷ مقاله دارد به عبارتی هر روز یک مقاله.

ادامه مطلب