آشنایی با Sass
توی این جلسه میریم ببینیم تا الان چی کردم. پس یه سر میزنیم به Bootstrap و در ادامه به Sass میپردازیم.
Sass رو روی VScode میاریم تا بتونیم راحتتر CSS بزنیم.
در ادامه به چند نکته در Sass میپردازیم تا آماده کار بشیم.
Sass یک زبان پیش پردازش CSS است که به توسعه‌دهندگان وب کمک می‌کند CSS را به طریقی بهتر و سازماندهی‌تر ایجاد کنند. با استفاده از Sass، می‌توانید کدهای CSS خود را بسیار خواناتر، قابل نگهداری‌تر و قدرتمندتر کنید. در زیر چند مورد از ویژگی‌های برجسته Sass را برایتان توضیح می‌دهم:
- متغیرها:
Sassبه شما این امکان را می‌دهد تا متغیرها را در کدهایCSSخود تعریف کنید. این به شما اجازه می‌دهد تا مقادیری مانند رنگها، پهناها و حتی فونت‌ها را یک‌بار تعریف کرده و در سرتاسر پروژه‌تان به آنها دسترسی داشته باشید. - توالی‌ها و توابع:
Sassدارای توالی‌ها (Mixins) و توابع است که به شما این امکان را می‌دهند تا کدهای تکراری را کاهش دهید. می‌توانید توالی‌ها را برای تولید کدهایCSSپیچیده‌تر یا توابع را برای انجام محاسبات درون خطی استفاده کنید. - توگل‌ها (Nesting): شما می‌توانید تگ‌ها و کلاس‌ها را درون یکدیگر تو در تو تعریف کنید تا کدهای
CSSخود را به شکل سازماندهی‌تری بنویسید. - واحدهای معیار
CSS:Sassبه شما این امکان را می‌دهد تا به واحدهای معیارCSSمانندpx،emوremبه صورت دینامیک دسترسی داشته باشید و از آنها بهره‌برداری کنید. - وارثی‌سازی (Inheritance): با
Sassمی‌توانید قوانینCSSرا به طور واضح تر و از طریق وارثی‌سازی کدها به تگ‌ها و کلاس‌ها اعمال کنید. - قابلیت تفکیک‌پذیری (Modularity):
Sassبه شما این امکان را می‌دهد تا پروژه‌تان را به بخش‌های کوچکتر و مدولار تقسیم کنید، که این به بهبود قابلیت نگهداری و مدیریت کد کمک می‌کند.
برای استفاده از Sass، شما نیاز دارید که ابتدا آن را نصب کنید و سپس فایل‌های Sass خود را ایجاد کنید و پس از پردازش با استفاده از کامپایلر Sass به فایل‌های CSS تبدیل کنید. به این ترتیب، می‌توانید از تمام امکانات و ویژگی‌های قدرتمند Sass بهره‌برداری کنید و کدهای CSS بهتری بسازید.
توی این قسمت با VSCode آشنا میشیم و یک پکیج کاربردی رو معرفی میکنیم که بدوم اون واقعا کد زدن سخته. در ادامه اولین صفحه HTML رو میسازیم و توش به معر ...
این قسمت، ادامه بحث در باره HTML هست. با تگ های بیشتری آشنا میشیم، همچنین کاربرد اتربیوت ها رو توی تگ ها یاد میگیریم. آدرس دهی نسبی رو میبینیم چجوریه ...
توی این قسمت در ابتدا، جلسه های قبل رو دوره میکنیم. در ادامه میگیم CSS چیه و چیکار میخواد واسمون بکنه. اولین CSS رو میزنیم و با اولین Selector آشنا می ...
در ادامه جلسه قبل ( آشنایی با CSS )، توی این جلسه به بحث بیشتر در باره سلکتورهایی مثل ID و CLASS می پردازیم. همچنین بیشتر در باره اولویت ها صحبت میکنی ...
توی این جلسه به چند Property و Value های مربوطه برای CSS می پردازیم. مثل position display border font-size و ... و البته بحث بیشتر ...
توی این قسمت، بیشتر با CSS کار میکنیم و با Property و Value های بیشتری آشنا میشیم مثل: transform background-image background-size backgro ...
توی این جلسه، به معرفی JQery می پردازیم. در واقع JQuery یک کتابخانه هست که با JavaScript نوشته شده. JQuery بهمون امکان کنترل Event های توی صفحه رو ...
توی این جلسه، به معرفی Bootstrap می پردازیم. Bootsrap یک Framework برای Front-End کارهاست تا همه چیرو خیلی سریعتر شروع کنن و نیاز به کنترل موارد کمتری ...
توی این جلسه میریم ببینیم تا الان چی کردم. پس یه سر میزنیم به Bootstrap و در ادامه به Sass میپردازیم. Sass رو روی VScode میاریم تا بتونیم راحتتر CS ...
هدف این جلسه معرفی ابزاری برای ساخت #اسلایدر (#slider) توی فرانت اند هست. همون طور که از قبل دیدین، ما برای درست کردن یک صفحه، میتونیم کد هارو از ...
توی این جلسه میخوایم با استفاده از چیزهایی که بلدیم چنتا اسلایدر بسازیم. برای همین نیاز به یک نمونه داریم. میریم از DIGIKALA نگاه میکنیم و ایده میگیری ...
نظرات
