Fundación - Referencia Flex Video SASS
Descripción
Puede cambiar los estilos de los componentes utilizando SASS Reference.
Variables
La siguiente tabla enumera las variables SASS en el archivo de configuración de un proyecto que hace que los estilos predeterminados del componente se personalicen.
No Señor. | Nombre y descripción | Tipo | Valor por defecto |
---|---|---|---|
1 | $flexvideo-padding-top Representa el relleno sobre el contenedor de video flexible. |
Número | rem-calc (25) |
2 | $flexvideo-margin-bottom Representa el margen debajo del contenedor de video flexible. |
Número | rem-calc (16) |
3 | $flexvideo-ratio Representa el relleno utilizado para crear una relación de aspecto de 4: 3. |
Número | 4 por 3 |
4 | $flexvideo-ratio-widescreen Representa el relleno utilizado para crear una relación de aspecto de 16: 9. |
Número | 16 por 9 |
Mixins
Para construir la salida CSS final de este componente, se pueden usar los siguientes mixins. Para construir su propia estructura de clases usando componentes Foundation, puede usar los mixins usted mismo.
flex-video
@include flex-video($ratio);
Se utiliza para crear un contenedor de video flexible. Acepta el parámetro $ ratio que se explica a continuación.
No Señor. | Descripción de parámetros | Tipo | Valor por defecto |
---|---|---|---|
1 | $ratio Representa la proporción del contenedor y formateado como x por y . |
Lista | $ flexvideo-ratio |
Funciones
flex-video
flex-video($ratio)
Crea una altura en porcentaje que se utiliza como relleno en un contenedor de video flexible. Acepta el parámetro $ ratio , que es de tipo List . El parámetro $ ratio representa la relación del contenedor y tiene el formato x por y .