intel-xdk - 在英特尔 XDK 的列表视图中插入缩略图

Question

我在我的项目中使用英特尔 XDK 中的列表视图模板我想在每个列表中使用图像的缩略图。有什么解决方法吗？因为我是 HTML 开发的新手

Answer 1

您可以在元素内手动添加代码<li>以创建<img>元素。这是使用图像缩略图 + 文本创建自定义列表的示例代码：自定义 ListView

<style>
    #afui #listview .list li {padding:10px 20px 10px 10px}
    .list-image {float:left;width:50px;height:50px}
    .list-text {margin-left:60px;min-height:50px}        
</style>

自定义<li>：

    <ul class="list">
        <li>
            <a href="#item1">
                <img class="list-image" src="data/male_user_icon.svg" />
                <div class="list-text"><b>username1</b><br>Placeholder text for this list item 1.</div>
            </a>
        </li>
    </ul>