Foundation - Flex Video SASS 参考

描述

您可以使用 SASS 参考来更改组件的样式。

下表列出了项目设置文件中用于自定义组件默认样式的 SASS 变量。

序号	名称和描述	类型	默认值
1	`$flexvideo-padding-top` 表示 Flex 视频容器上方的填充。	数值	`rem-calc(25)`
2	`$flexvideo-margin-bottom` 表示 Flex 视频容器下方的边距。	数值	`rem-calc(16)`
3	`$flexvideo-ratio` 表示用于创建 4:3 宽高比的填充。	数值	4 比 3
4	`$flexvideo-ratio-widescreen` 表示用于创建 16:9 宽高比的填充。	数值	16 比 9

要构建此组件的最终 CSS 输出，可以使用以下混合宏。要使用 Foundation 组件构建您自己的类结构，您可以自己使用这些混合宏。

@include flex-video($ratio);

用于创建 Flex 视频容器。它接受参数 $ratio，如下所述。

序号参数和描述类型默认值

序号	参数和描述	类型	默认值
1	`$ratio` 表示容器的比例，格式为 x 比 y。	列表	`$flexvideo-ratio`

$ratio

表示容器的比例，格式为 x 比 y。

列表

$flexvideo-ratio

flex-video($ratio)

它创建一个百分比高度，用作 Flex 视频容器中的填充。它接受参数 $ratio，其类型为列表。参数 $ratio 表示容器的比例，格式为 x 比 y。

foundation_media.htm

打印页面