Hablar con descaro a

La versión actual de la página aún no ha sido revisada por colaboradores experimentados y puede diferir significativamente de la versión revisada el 25 de diciembre de 2021; las comprobaciones requieren 4 ediciones .
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:

Reglas anidadas

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 : subrayado

Será transmitido en:

# encabezado { fondo : #FFFFFF ; } #encabezado . _ error { color : #FF0000 ; } # encabezado a { texto-decoración : ninguno ; } # encabezado a : hover { texto-decoración : subrayado ; }

Variables en CSS

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 : $ linkColor

Será 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 ; }

Véase también

Literatura

Notas

  1. Dardo Sass 1.53.0 .

Enlaces