- Foundation 常規
- Foundation - 全域性樣式
- Foundation - Sass
- Foundation - JavaScript
- Foundation - JavaScript 實用工具
- Foundation - 媒體查詢
- Foundation - 網格系統
- Foundation - Flex 網格
- Foundation - 表單
- Foundation - 可見性類
- Foundation - 基礎排版
- Foundation - 排版輔助工具
- Foundation - 基本控制元件
- Foundation - 導航
- Foundation - 容器
- Foundation - 媒體
- Foundation - 外掛
- Foundation SASS
- Foundation - Sass 函式
- Foundation - Sass 混合宏
- Foundation 庫
- Foundation - Motion UI
- Foundation 有用資源
- Foundation - 快速指南
- Foundation - 有用資源
- Foundation - 討論
Foundation - 媒體物件 Sass 參考
變數
您可以使用下表列出的 Sass 變數來更改元件的樣式。
| 序號 | 名稱和描述 | 型別 | 預設值 |
|---|---|---|---|
| 1 |
$mediaobject-margin-bottom 設定媒體物件的底部邊距。 |
數字 | $global-margin |
| 2 |
$mediaobject-section-padding 定義媒體物件內的左右填充。 |
數字 | $global-padding |
| 3 |
$mediaobject-image-width-stacked 當物件垂直堆疊時，影像寬度將為 100%，並透過將其設定為“auto”來保持影像的自然寬度。 |
數字 | 100% |
混合宏
您可以使用混合宏來構建媒體物件元件的 CSS 類結構。您可以使用以下混合宏來構建您自己的類結構：
media-object-container
您可以使用以下混合宏來新增媒體物件的樣式：
@include media-object-container;
media-object-section
您可以使用以下混合宏來新增媒體物件部分的樣式：
@include media-object-section($padding);
它可以使用以下表格中所示的引數進行定義：
| 序號 | 引數和描述 | 型別 | 預設值 |
|---|---|---|---|
| 1 |
$padding 定義各部分之間的填充。 |
數字 | $mediaobject-section-padding |
media-object-stack
您可以使用以下混合宏來新增媒體物件堆疊部分的樣式：
@include media-object-stack;
foundation_containers.htm
廣告