Categoría: SASS

¿Cómo seleccionar solo niños directos del elemento con Sass?

Posted on by Rudeus Greyrat

Introducción: Sass es un lenguaje de secuencias de comandos que se compila en hojas de estilo en cascada (CSS). Es una especie de lenguaje de preprocesador. Inicialmente fue diseñado por Hampton Catlin y luego fue desarrollado por Natalie Weizenbaum. Después de sus versiones iniciales, Weizenbaum y Chris Eppstein continuaron ampliando SASS con SassScript. Admite cuatro … Continue reading «¿Cómo seleccionar solo niños directos del elemento con Sass?»

¿Cómo evitar que el texto tome más de una línea en SASS?

Posted on by Rudeus Greyrat

A veces queremos mostrar el texto en nuestra página web evitando que el texto ocupe más de una línea o algo que detenga el ajuste de palabras. Se puede hacer agregando fácilmente algunos atributos en el archivo  sass . Enfoque: Comenzamos creando un archivo HTML simple al que agregaríamos texto en el cuerpo usando la … Continue reading «¿Cómo evitar que el texto tome más de una línea en SASS?»

¿Cómo crear argumentos opcionales para una mezcla SASS?

Posted on by Rudeus Greyrat

Para crear argumentos opcionales para un SASS @mixin, se debe pasar el mixin declarado y se debe incluir. El siguiente enfoque lo explicará claramente. Sintaxis: @mixin function-name($var1, $x:val){ /* stylesheet properties */ } @include function-name(value, 0); Enfoque: la asignación de valores nulos en @mixin incluye Podemos hacer que un argumento de mixin sea opcional definiendo … Continue reading «¿Cómo crear argumentos opcionales para una mezcla SASS?»

¿Cómo imprimir variables en el terminal en SASS?

Posted on by Rudeus Greyrat

SASS tiene tres métodos para proporcionar una salida en la terminal o consola del usuario. Nota: El resultado puede variar de una implementación a otra y de un compilador a otro. Uso de la regla @error: al escribir mixins y funciones que toman argumentos, generalmente desea asegurarse de que esos argumentos tengan los tipos y … Continue reading «¿Cómo imprimir variables en el terminal en SASS?»

¿Por qué SASS se considera mejor que LESS?

Posted on by Rudeus Greyrat

SASS (Syntactically Awesome StyleSheets) y LESS (Leaner CSS) son preprocesadores de CSS o extensiones de CSS. Se puede decir que un preprocesador es un lenguaje de programación y secuencias de comandos que está diseñado para mejorar la apariencia, la calidad del tema, la capacidad de servicio y la extensibilidad, ya que extiende CSS y luego … Continue reading «¿Por qué SASS se considera mejor que LESS?»

¿Cómo crear un archivo LESS y cómo compilarlo?

Posted on by Rudeus Greyrat

LESS (que significa Leaner Style Sheets) es una extensión de lenguaje compatible con versiones anteriores para CSS. CSS en sí mismo es excelente para definir estilos y aplicarlos a varios elementos HTML, pero tiene algunas limitaciones. Limitaciones de CSS: Escribir código CSS se vuelve agotador, especialmente en grandes proyectos. Mantener el código CSS es difícil … Continue reading «¿Cómo crear un archivo LESS y cómo compilarlo?»

SASS | Funciones de color

Posted on by Rudeus Greyrat

Componentes de color: antes de pasar a las funciones de color de SASS, asegurémonos de conocer los elementos de color que cambian. La teoría del color simple divide cualquier color en tres componentes básicos: matiz, saturación y valor. HUE (también llamado “color local”) es generalmente el color del que hablamos. Me gusta: cielo azul, sol … Continue reading «SASS | Funciones de color»

Variable SASS en la función CSS calc()

Posted on by Rudeus Greyrat

CSS es en sí mismo un buen lenguaje para el diseño web, pero las hojas de estilo son cada vez más complejas, más grandes e incluso más difíciles de mantener. Ahí es donde entra en acción un preprocesador como Sass y nos ayuda a usar funciones que ni siquiera existen en CSS. La función calc() … Continue reading «Variable SASS en la función CSS calc()»

¿Cómo crear un mixin para marcador de posición en SASS?

Posted on by Rudeus Greyrat

Mixin es una de las mejores características de SASS, que funciona como una función. Puede crear mixins para propiedades CSS repetidas y luego incluir esos mixins usando @include en su clase CSS. Acercarse: Creamos un mixin, estamos usando @content que nos permite inyectar todo el bloque de código CSS dentro del mixin, ese bloque reemplaza … Continue reading «¿Cómo crear un mixin para marcador de posición en SASS?»