📅 最后修改于: 2020-10-22 05:53:03 🧑 作者: Mango
MDL提供了一系列CSS类，以应用各种预定义的视觉和行为增强功能并显示不同类型的卡。下表列出了可用的类及其效果。
| Sr.No. | Class Name & Description |
|---|---|
| 1 |
mdl-card Identifies div element as an MDL card container, required on “outer” div. |
| 2 |
mdl-card–border Puts a border to the card section that it is applied to and is used on the “inner” divs. |
| 3 |
mdl-shadow–2dp through mdl-shadow–16dp Sets variable shadow depths (2, 3, 4, 6, 8, or 16) to card and is optional, goes on “outer” div; if omitted, no shadow is shown. |
| 4 |
mdl-card__title Identifies div as a card title container and is required on “inner” title div. |
| 5 |
mdl-card__title-text Puts appropriate text characteristics to card title and is required on head tag (H1 – H6) inside title div. |
| 6 |
mdl-card__subtitle-text Puts text characteristics to a card subtitle and is optional. It should be a child of the title element. |
| 7 |
mdl-card__media Identifies div as a card media container and is required on “inner” media div. |
| 8 |
mdl-card__supporting-text Identifies div as a card body text container and assigns appropriate text characteristics to body text and is required on “inner” body text div; text goes directly inside the div with no intervening containers. |
| 9 |
mdl-card__actions Identifies div as a card actions container and assigns appropriate text characteristics to actions text and is required on “inner” actions div; content goes directly inside the div with no intervening containers. |
下面的示例将帮助您了解使用mdl-tooltip类来显示不同类型的工具提示。
Wide Card with Share Button Square Card
H5
HTML5 is the next major revision of the HTML standard
superseding HTML 4.01, XHTML 1.0, and XHTML 1.1.
HTML5 is a standard for structuring and presenting
content on the World Wide Web.
H5
HTML5 is the next major revision of the HTML standard
superseding HTML 4.01, XHTML 1.0, and XHTML 1.1.
HTML5 is a standard for structuring and presenting
content on the World Wide Web.
Image Card Event Card
html5-logo.jpg
Add to Calendar
event
验证结果。