media-range (_mediaqueries.scscs)

Genera un rango inclusivo entre dos medidas del mismo eje. Por defecto combina min-width y max-width mediante and.

Los números sin unidad se interpretan con px; las medidas que ya incluyen una unidad, como rem, se conservan sin alteraciones.

Interface

@mixin media-range($min, $max, $axis: width, $units: px, $means: screen);

Parámetro	Tipo	Default	Descripción
min	Number	-	Define el límite inferior inclusivo.
max	Number	-	Define el límite superior inclusivo.
axis	Keyword	width	Selecciona el eje width o height.
units	String	px	Define la unidad para límites sin unidad.
means	Keyword	screen	Define el media type de la consulta.

@include media-range((
    min: 48rem,
    max: 75rem,
    axis: width,
    unit: px,
    media: screen
)) { ... }

Clave	Tipo	Default	Descripción
min	Number	-	Define el límite inferior inclusivo.
max	Number	-	Define el límite superior inclusivo.
axis	Keyword	width	Selecciona el eje width o height.
unit \| units \| u	String	px	Define la unidad para límites sin unidad.
media \| means \| m	Keyword	screen	Define el media type de la consulta.

Rango de ancho inclusivo

<div class="example_media_range">Rango de ancho inclusivo</div>