html5 - 这样的列表排版如何写比较好！

Question

手机页面！

图标互相对齐，文字居中对齐并与其它行文字对齐，红色圈金额（￥0.00）另起一行对齐！

希望贴出html和css代码

Answer 1

如图，只要保证图中这两条黑线对其不就好了么~~~

1、图标大小一致，居中
2、图标与上border间距一致，居中
3、第二行文字大小一致，line-height一致，居中
4、第三行文字大小一致，line-height一致，居中

Answer 2

<ul>

<li>
    <p><img src="图片地址" /></p>
    <p>标题</p>
    <p>￥0.00</p>
</li>

//重复li,修改图片地址、标题名、金额，这些一般都是从后台返回一个字段给你。

</ul>
css样式：
li{

text-align:center;

}

其他的样式你自己应该知道怎么写了吧