Hablar con descaro a | |
---|---|
Tipo de | Procesador de plantillas de compilación |
Desarrollador | Nathan WeizenbaumChris EppsteinHampton Catlin _ |
Sistema operativo | multiplataforma |
Primera edición | 28 de noviembre de 2006 |
ultima versión | Dart Sass: 1.53.0 ( 22 de junio de 2022 ) [1] |
Licencia | Licencia MIT |
Sitio web | sass-lang.com |
Sass (Syntactically Awesome Stylesheets) es un módulo incluido con Haml . Sass es un metalenguaje basado en CSS diseñado para aumentar el nivel de abstracción del código CSS y simplificar los archivos de hojas de estilo en cascada .
El lenguaje Sass tiene dos sintaxis:
Una de las características clave de Sass son las reglas anidadas, que facilitan la creación y edición de selectores anidados.
# fondo del encabezado : #FFFFFF . color de error : # FF0000 una decoración de texto : ninguna & : decoración de texto flotante : subrayadoSerá transmitido en:
# encabezado { fondo : #FFFFFF ; } #encabezado . _ error { color : #FF0000 ; } # encabezado a { texto-decoración : ninguno ; } # encabezado a : hover { texto-decoración : subrayado ; }Sass agrega constantes y mixins a CSS . Esto facilita el mantenimiento de la integridad de los datos dentro de un gran conjunto de estilos. Las constantes le permiten establecer un valor y usarlo dentro de estilos, con mixins puede hacer lo mismo con un bloque de atributos de estilo.
$ enlaceColor : # 00F un color : $ linkColorSerá transmitido en:
un { color : #00F ; }Un ejemplo del uso de impurezas, la similitud de funciones:
@mixin border-radius ( $radius , $border , $color ) { -webkit-border-radius : $radius ; -moz-border-radio : $radio ; -ms-border-radius : $radio ; borde-radio : $radio ; borde : $borde sólido $color } .box { @ include border-radius ( 10px , 1px , rojo ); }Se transmitirá:
. cuadro { -webkit -border-radius : 10 px ; -moz- borde-radio : 10 px ; -ms- borde-radio : 10 px ; borde - radio : 10px borde : 1 px rojo sólido ; }Lenguajes de hojas de estilo ( compare , list ) | |
---|---|
Modos |
|
Estándar | |
no estándar |
|