Différence entre SASS et CSS

Écrire un style pour un site web est un art. Avec toutes les façons dont vous pouvez manipuler les éléments HTML, il est important de garder votre code aussi propre que possible pour éviter les problèmes. C’est là que SASS entre en jeu.
 
 
SASS est une extension de CSS qui ajoute une super-puissance qui le rend plus utile, plus productif et qui écrit du code stable. Il est également appelé préprocesseur CSS.
 
Tous les préprocesseurs CSS tels que SASS, SCSS, LESS, STYLUS sont compilés en CSS, car il s’agit du seul langage connait par le navigateur Web.
 
Lors du développement de sites Web, vous avez besoin d’un compilateur pour les préprocesseurs CSS.

Table de comparaison

.div
  width: 100px
  height: 100px
  display: inline-block

.div {
  width: 100px;
  height: 100px;
  display: inline-block;
}

Exemple en CSS :

body{
   width: 200px
   color: red;
}
body div{
   width: 50px;
   background: red;
}

Exemple en SAAS :

$color: red;
$width: 200px;
$font: Helvetica, sans-serif;

body{
   width: $width;
   color: $color;
   font: 100% $font;
 
   div{
      width: $width;
      background:$color;
   }
}

L’exemples ci-dessus différencier CSS et SASS, bien que SASS soit compilé en CSS traditionnel, pour qui’il soit connait par le navigateur Web.
 

Conclusion

CSS est l’implémentation standard du composant de style par le W3C et tous les navigateurs. Tandis que SASS est un préprocesseur doté de nombreuses fonctionnalités pour rendre le style plus rapide et plus efficace.