Adquiere por un año todos los cursos, escuelas y certificados por un precio especial.

Adquiere por un año todos los cursos, escuelas y certificados por un precio especial.

Antes:$249

Currency
$219/año
Paga en 4 cuotas sin intereses
Paga en 4 cuotas sin intereses
Comprar ahora

Termina en:

01d

00h

15m

37s

1

Como usar media queries en Sass

En el siguinte texto te mostraré una forma de hacer uso de media queries en tus proyectos con Sass.

La siguiente práctica hace que podamos escribir los cambios dentro del mismo bloque del código que tenga los estilos de nuestro selector objetivo.

Esto lo logramos con un mixin y la At-rule @content, veamos como se hace:

  1. Declaramos un mixin que contenga nuestra media querie, dentro de esta añadimos la at-rule @content, esto hace que todos los estilos que escribamos dentro del mixin se apliquen a la media querie.
@mixin tablet {
    @media screen and (max-width: 900px) {
        @content
    }
}
@mixin mobile{
    @media screen and (max-width: 520px) {
        @content
    }
}
  1. Lamamos al mixim con la at-rule @include, usamos el mixim con la media querie deseada, abrimos llaves y dentro de ellas colocamos los estilos deseados
section{
    width: 100%;
    color: red;
    @include tablet() {
        color: yellow;
    }
    @include mobile() {
        color: blue;
    }
}

Si deseas mas información, estos links puden ayudarte.

Escribe tu comentario
+ 2