Less, SASS/SCSS

The CSS preprocessor is a specialized programming language that designs Web page styles and then compiles them into normal CSS files for use by the project. The CSS preprocessor adds some programming features to the CSS, regardless of browser compatibility issues.

The use of variables, simple logic programs, functions, and so on in CSS can make CSS more concise, more adaptable, more readable, easier to maintain, and many other benefits.

Website Description:

Sass is a meta-language that is higher than CSS, which can be used to describe file styles in a clear, structured way, with more powerful features than regular CSS.

Sass provides a cleaner, more elegant syntax, while providing a variety of features to create maintainable and managed stylesheets.

Sass and Scss differences

1. Unlike the file extension, Sass is based on ". Sass "suffix is extension, and scss is the extension with". scss "suffix;

2. Grammar writing is different, Sass is written in strict indentation grammar, without curly braces ({}) and a few (;), and Scss.

It is recommended to use a file with the suffix named Scss to avoid the strict mode of sass suffix requiring an error.

//Sass$font-stack:helvetica, Sans-serif$primary-color: #333body  font:100% $font-stack  color:$ Primary-color//scss$font-stack:helvetica, Sans-serif; $primary-color: #333; body{font:100% $ Font-stack; color:$primary-color;}

Test monitoring SASS

Sass--watch Test.scss:test.css

Sass is a pre-treatment tool to help do things in advance

Sass different styles of output mode

Nested output mode nested, expanded output mode expanded, compact output mode, compressed output mode compressed

Nested output mode Nestedsass--watch test.scss:test.css--style nested

Expand Output Mode Expandedsass--watch test.scss:test.css--style Expanded

Compact and comfortable mode compact (single-line format) Sass--watch test.scss:test.css--style Compact

Compression output mode Compressedsass--watch test.scss:test.css--style Compressed

Less, SASS/SCSS