CardMediaAPI

React CardMedia 元件的 API 參考文件。了解此匯出模組的屬性、CSS 和其他 API。

範例

如需此 React 元件的使用範例和詳細資訊，請造訪元件範例頁面

import CardMedia from '@mui/material/CardMedia';
// or
import { CardMedia } from '@mui/material';

原生元件的屬性也可用。

名稱	類型	描述
children	node	元件的內容。
classes	object	覆寫或擴充套用至元件的樣式。請參閱下方的CSS 類別 API 以取得更多詳細資訊。
component	elementType	用於根節點的元件。可以是字串 (使用 HTML 元素) 或元件。
image	string	要顯示為背景圖片的圖片。必須指定 `image` 或 `src` 屬性。請注意，呼叫者必須指定高度，否則圖片將不可見。
src	string	`image` 屬性的別名。僅適用於媒體元件。媒體元件：`video`、`audio`、`picture`、`iframe`、`img`。
sx	Array<func \| object \| bool> \| func \| object	系統屬性，允許定義系統覆寫以及額外的 CSS 樣式。請參閱 `sx` 頁面以取得更多詳細資訊。

ref 會轉發到根元素。

您可以使用 MuiCardMedia 透過主題變更此元件的預設屬性。

這些類別名稱對於使用 CSS 設定樣式很有用。它們會在觸發特定狀態時套用至元件的插槽。

類別名稱	規則名稱	描述
.MuiCardMedia-img	img	如果 `component="picture or img"`，則套用至根元素的樣式。
.MuiCardMedia-media	media	如果 `component="video, audio, picture, iframe, or img"`，則套用至根元素的樣式。
.MuiCardMedia-root	root	套用至根元素的樣式。

您可以使用以下自訂選項之一覆寫元件的樣式

如果您在此頁面中找不到資訊，請考慮查看元件的實作以取得更多詳細資訊。