卡與阿凡達和影象
如果你想在卡片上顯示頭像,請使用 <md-card-avatar>
指令,該指令必須放在 <md-card-header>
指令中。<md-card-avatar>
指令接受 <img />
標記。
可選:.md-user-avatar
,這使得 <img />
標籤具有圓形外觀。
index.html :
<md-card>
<md-card-header>
<!--Avatar-->
<md-card-avatar>
<img src="/path/to/avatar.svg" class="md-user-avatar"/>
</md-card-avatar>
<!--Header text-->
<md-card-header-text>
<span class="md-title">Lorem</span>
<span class="md-subhead">Ipsum</span>
</md-card-header-text>
</md-card-header>
<!--Card image-->
<img src="/path/to/cardimage.svg" class="md-card-image" alt="Card Image">
<!--Card title-->
<md-card-title>
<md-card-title-text>
<span class="md-headline">Card header</span>
</md-card-title-text>
</md-card-title>
<md-card-content>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus posuere et risus sed finibus. Nunc vestibulum sagittis enim ut sagittis.</p>
</md-card-content>
</md-card>