Quelle est la différence entre css et scss?

J'ai déjà lu beaucoup de choses à ce sujet, mais je suis toujours confus.

Je connais très bien CSS mais je n'ai qu'une seule question: en quoi scss est-il différent de CSS, et si j'utilise scss au lieu de CSS, cela fonctionnera-t-il de la même manière?

29
demandé sur Eric Streeper 2017-09-25 11:13:14

2 réponses

En plus de Idriss réponse:

CSS

En CSS, nous écrivons le code comme indiqué ci-dessous, en pleine longueur.

body{
 width: 800px;
 color: #ffffff;
}
body content{
 width:750px;
 background:#ffffff;
}

SCSS

Dans SCSS, nous pouvons raccourcir ce code en utilisant un @mixin afin que nous n'ayons pas à écrire les propriétés color et width encore et encore. Nous pouvons définir cela à travers une fonction, de la même manière que PHP ou d'autres langages.

$color: #ffffff;
$width: 800px;

@mixin body{
 width: $width;
 color: $color;

 content{
  width: $width;
  background:$color;
 }
}

SASS

Dans SASS cependant, toute la structure est visuellement plus rapide et plus propre que SCSS.

  • , Il est sensible à l'espace blanc lorsque vous utilisez le copier-coller,
  • Il semble qu'il ne supporte pas actuellement le CSS en ligne.

    $color: #ffffff
    $width: 800px
    $stack: Helvetica, sans-serif
    
    body
      width: $width
      color: $color
      font: 100% $stack
    
      content
        width: $width
        background:$color
    
46
répondu Hash 2018-06-13 14:01:21

CSS est le langage de style que tout navigateur comprend pour styliser les pages web.

SCSS est un type spécial de fichier pour SASS, un programme écrit en Ruby qui assemble des feuilles de style CSS pour un navigateur, et pour plus d'informations SASS ajoute beaucoup de fonctionnalités supplémentaires à css comme les variables, l'imbrication et plus qui peut rendre l'écriture CSS plus facile et plus rapide. Les fichiers SCSS sont traités par le serveur exécutant une application web pour produire un CSS traditionnel que votre navigateur peut comprendre.

11
répondu Idriss Benbassou 2017-09-25 08:18:59