css چیست؟

CSS چیست؟

CSS زبانی برای توصیف ارائه صفحات وب، از جمله رنگ ها، چیدمان و قلم ها است. این امکان را به شما می دهد تا ارائه را با انواع مختلف دستگاه ها ، مانند صفحه های بزرگ ، صفحه های کوچک یا چاپگر تطبیق دهید. CSS مستقل از HTML است و می تواند با هر زبان نشانه گذاری مبتنی بر XML استفاده شود. جداسازی HTML از CSS حفظ سایتها، به اشتراک گذاری برگه های سبک در صفحه ها و متناسب سازی صفحات به محیط های مختلف را آسان تر می کند.

چرا استفاده از Css  اهمیت دارد؟

دنیای برنامه‌نویسی را اگر به پیکر یک انسان تشبیه کنیم، Css پوست، گوشت و البته لباس‌های یک انسان خواهد بود. انسان بدون داشتن گوشت و استخوان، تنها یک اسکلت خالی است. یک وبسایت هم بدون Css تنها بدنه‌ای خالی است که یک مشت نوشته و خط آن را پر کرده‌اند.

به کمک سی‌اس‌اس است که می‌توان پوست و گوشت را به اسکلت سایت بخشید و البته یک کت‌وشلوار شیک هم به آن اضافه کرد! در نظر داشته باشید که یک وبسایت هرچقدر هم هسته قدرتمندی داشته باشد، با سرعت بالا بارگذاری شود و مطالب کاربردی و مفیدی در آن وجود داشته باشد، بدون وجود Css هیچکس حوصله‌ی بازدید از آن را نخواهد داشت.

پس هر برنامه‌نویسی که در زمینه‌ی طراحی وبسایت فعالیت می‌کند، باید بر این زبان نیز تسلط کامل داشته باشد.

کاربردهای CSS و دلیل محبوبیت آن

تنوع و امکانات فوق‌العاده در کنار انعطاف‌پذیری بی ‌نهایت دلچسب CSS، این زبان را جزئی جدایی ناپذیر از وب‌سایت‌ها ساخته است، همچنین به روز رسانی‌ها و ویژگی‌های جذاب روز افزون این زبان طراحان را شیفته خود کرده، امکان افزودن افکت‌های فوق‌العاده جذاب در ورژن 3 این زبان (CSS-3) بدون افزودن صدها خط کد جاوا اسکریپت رویای طراحان را برای ساخت صفحاتی زیبا و سبک را به حقیقت پیوند داده است.

امکانات جذابی چون انیمیشن، گرادیانت، چند پس زمینه هم‌زمان، قرارگیری بخش‌های مختلف در کنار هم، واکنشگرا بودن صفحات در رزولوشن‌های مختلف و انعطاف پذیری در فلکس‌ها (Flex) چیزی است که تمامی نیازهای یک طراح فوق حرفه‌ای را نیز برآورده می‌کند. محبوبیت این زبان تا جایی پیش رفته است که بسیاری از برنامه‌نویسان اقدام به نوشتن پلاگین‌ها و کدهای آماده به وسیله این زبان کرده‌اند.

تفاوت پیش پردازنده‌های SCSS, SASS, LESS با CSS

هیچ کدام از این پیش پردازنده‌ها همانطور که از اسم‌شان پیداست جایگزینی برای CSS نیستند و تنها برنامه‌نویسی با CSS را برای طراحان راحت‌تر می‌کنند. کدهای ایجاد شده توسط این پیش پردازنده‌ها نیز در نهایت به زبان CSS کامپایل (ترجمه) خواهد شد چرا که مرورگرها تنها CSS را می‌شناسند.

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

شاید این سوال برایتان پیش آمده باشد که تفاوت این پیش پردازنده‌ها با یکدیگر چیست و چرا برای یک زبان ساده مثل CSS چندین و چند پیش پردازنده وجود دارد با اینکه با یک پیش پردازنده منسجم کار طراحان نیز ساده تر می‌شد.

یکی از دلایل تفاوت‌های ساختاری میان این پیش پردازنده‌هاست. به عنوان مثال زبان برنامه نویسی پیش پردازنده LESS که مخفف Leaner Style Sheets است با استفاده از جاوا اسکریپت کار می‌کند که یک زبان سمت کلاینت یا Client side است (یعنی روی سیستم کاربر دانلود و اجرا می‌شود) که معایبی را به همراه دارد. برای مثال اگر کاربر اجرای جاوا اسکریپت خود را در مرورگر غیر فعال کند اجرای LESS نیز دچار مشکل خواهد شد. اما در عوض نمایش خطاها در این پیش پردازنده دقیق‌تر است.

زبان پیش پردازنده SASS مخفف Syntactically Awesome Style Sheets که یکی از پرطرفدارترین‌هاست. یک زبان سمت سرور یا Server Side است که روی زبان Ruby اجرا می‌شود و برای کد نویسی با آن ابتدا باید Ruby را نصب کنید. یکی از مزایای این زبان این است که کاربران حق انتخاب بین دو نوع کد نویسی یا Syntax دارند؛ یعنی می‌توانند بین SCSS و Indented که هر دو زیر مجموعه SASS هستند یکی را برای کارکرد انتخاب کنند.

از مزایای دیگر این زبان این است که روی همه داده‌ها چه عددی و چه هر نوع دیگر پیمایش می‌کند در حالی که زبان LESS تنها روی داده‌های عددی پیمایش می‌کند و مزایای فوق العاده‌ی دیگری همچون sass-convert برای تبدیل پرونده‌ها از یک syntax به یک syntax دیگر این زبان را یکی از پر طرفدار‌ترین‌ها کرده است.

در مورد SCSS نیز همانطور که گفته شد یکی از سینتکس‌های این زبان و یا به عبارتی زیرمجموعه آن است که به دلیل انعطاف پذیری و کاربردهای فوق‌ العاده آن بیشتر از نوع دیگر مورد توجه قرار گرفته است.