DEV Community

Arsalan Mlaik
Arsalan Mlaik

Posted on

8

CSS VS SCSS

here's a comparison of CSS and SCSS (Sass):

Aspect CSS SCSS (Sass)
Syntax Plain text with selectors and properties Extension of CSS with enhanced syntax
Variables Not supported Supported using $ prefix
Nesting Limited support with descendant selectors Fully supported with nesting
Mixins Not supported Supported with @mixin directive
Functions Not supported Supported with built-in and custom functions
Inheritance Not supported Supported with @extend directive
Importing Supported with @import Supported with @import
Comments Supported with /* */ Supported with // and /* */
Math operations Limited support for basic operations Fully supported with arithmetic operators
Code readability May require repetitive code Improved readability with variables, nesting, and mixins
File extension .css .scss or .sass

Please note that SCSS (Sass) is a superset of CSS, meaning you can write regular CSS within an SCSS file, so it's more versatile and developer-friendly. It allows you to use the features listed above to make your stylesheets more organized and maintainable.

Image of Datadog

How to Diagram Your Cloud Architecture

Cloud architecture diagrams provide critical visibility into the resources in your environment and how theyโ€™re connected. In our latest eBook, AWS Solution Architects Jason Mimick and James Wenzel walk through best practices on how to build effective and professional diagrams.

Download the Free eBook

Top comments (4)

Collapse
 
developedbyjk profile image
developedbyjk โ€ข

Great Post @arsalanmee ๐Ÿ‘๐Ÿ”ฎ.
These Table were good for comparision!๐Ÿ˜๐Ÿ˜Ž๐Ÿ”ฅ

Collapse
 
arsalanmee profile image
Arsalan Mlaik โ€ข

Thanx A Lot

Collapse
 
respect17 profile image
Kudzai Murimi โ€ข

Thanks for sharing but l support CSS though

Collapse
 
arsalanmee profile image
Arsalan Mlaik โ€ข

Thanks Kudzai for response!

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more