温泉 UI 带有可扩展列表和带有描述的图标
onsen UI with expanable list and icons with description
我想要这个可扩展的列表缩略图,还允许我添加我的文字
我在网上搜索过,目前只能选一个,不能选两个。
您可以像这样组合两种类型的列表项:
<link href="https://unpkg.com/onsenui/css/onsen-css-components.css" rel="stylesheet"/>
<link href="https://unpkg.com/onsenui/css/onsenui.css" rel="stylesheet"/>
<script src="https://unpkg.com/onsenui/js/onsenui.js"></script>
<ons-page>
<ons-list>
<ons-list-header>Expandable with thumbnails and titles</ons-list-header>
<ons-list-item expandable>
<div class="left">
<img class="list-item__thumbnail" src="https://placekitten.com/g/40/40">
</div>
<div class="center">
<span class="list-item__title">Cutest kitty</span><span class="list-item__subtitle">On the Internet</span>
</div>
<div class="expandable-content">Expandable content</div>
</ons-list-item>
</ons-list>
</ons-page>
我想要这个可扩展的列表缩略图,还允许我添加我的文字
我在网上搜索过,目前只能选一个,不能选两个。
您可以像这样组合两种类型的列表项:
<link href="https://unpkg.com/onsenui/css/onsen-css-components.css" rel="stylesheet"/>
<link href="https://unpkg.com/onsenui/css/onsenui.css" rel="stylesheet"/>
<script src="https://unpkg.com/onsenui/js/onsenui.js"></script>
<ons-page>
<ons-list>
<ons-list-header>Expandable with thumbnails and titles</ons-list-header>
<ons-list-item expandable>
<div class="left">
<img class="list-item__thumbnail" src="https://placekitten.com/g/40/40">
</div>
<div class="center">
<span class="list-item__title">Cutest kitty</span><span class="list-item__subtitle">On the Internet</span>
</div>
<div class="expandable-content">Expandable content</div>
</ons-list-item>
</ons-list>
</ons-page>