@mixin mainImagen ($medidaHorizontal, $medidaVertical){
width: 100%;
height: 65%;
display: flex;
background-position: $medidaHorizontal $medidaVertical;
background-size: cover;
}
.main-imagen-beline {
@include mainImagen(10%, 40%,);
background-image: url ("../imagenes/modelo1/imagenprincipal.jpg");
}
.main-imagen-yessica {
@include mainImagen(10%, 0%,);
background-image: url ("../imagenes/modelo2/imagenprincipal.jpg");
}
.main-imagen-justiny {
@include mainImagen(10%, 0%,);
background-image: url ("../imagenes/modelo3/imagenprincipal.jpg");
}
CÓDIGO COMPILADO EN CSS (NÓTESE LA FALTA DE PARENTESIS EN LA RUTA):
.main-imagen-beline {
width: 100%;
height: 65%;
display: flex;
background-position: 10% 40%;
background-size: cover;
background-image: url "../imagenes/modelo1/imagenprincipal.jpg"; }
.main-imagen-yessica {
width: 100%;
height: 65%;
display: flex;
background-position: 10% 0%;
background-size: cover;
background-image: url "../imagenes/modelo2/imagenprincipal.jpg"; }
.main-imagen-justiny {
width: 100%;
height: 65%;
display: flex;
background-position: 10% 0%;
background-size: cover;
background-image: url "../imagenes/modelo3/imagenprincipal.jpg"; }