List

            <div class="mx-cells__title">带说明的列表项</div>
            <div class="mx-cells">
                <div class="mx-cell">
                    <div class="mx-cell__bd">
                        <p>标题文字</p>
                    </div>
                    <div class="mx-cell__ft">说明文字</div>
                </div>
                <div class="mx-cell mx-cell_swiped">
                    <div class="mx-cell__bd" >
                        <div class="mx-cell">
                            <div class="mx-cell__bd">
                                <p>标题文字</p>
                            </div>
                            <div class="mx-cell__ft">说明文字</div>
                        </div>
                    </div>
                </div>
            </div>
        

            <div class="mx-cells__title">带图标、说明的列表项</div>
            <div class="mx-cells">
                <div class="mx-cell">
                    <div class="mx-cell__hd"><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC4AAAAuCAMAAABgZ9sFAAAAVFBMVEXx8fHMzMzr6+vn5+fv7+/t7e3d3d2+vr7W1tbHx8eysrKdnZ3p6enk5OTR0dG7u7u3t7ejo6PY2Njh4eHf39/T09PExMSvr6+goKCqqqqnp6e4uLgcLY/OAAAAnklEQVRIx+3RSRLDIAxE0QYhAbGZPNu5/z0zrXHiqiz5W72FqhqtVuuXAl3iOV7iPV/iSsAqZa9BS7YOmMXnNNX4TWGxRMn3R6SxRNgy0bzXOW8EBO8SAClsPdB3psqlvG+Lw7ONXg/pTld52BjgSSkA3PV2OOemjIDcZQWgVvONw60q7sIpR38EnHPSMDQ4MjDjLPozhAkGrVbr/z0ANjAF4AcbXmYAAAAASUVORK5CYII=" alt="" style="width:20px;margin-right:5px;display:block"></div>
                    <div class="mx-cell__bd">
                        <p>标题文字</p>
                    </div>
                    <div class="mx-cell__ft">说明文字</div>
                </div>
                <div class="mx-cell">
                    <div class="mx-cell__hd"><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC4AAAAuCAMAAABgZ9sFAAAAVFBMVEXx8fHMzMzr6+vn5+fv7+/t7e3d3d2+vr7W1tbHx8eysrKdnZ3p6enk5OTR0dG7u7u3t7ejo6PY2Njh4eHf39/T09PExMSvr6+goKCqqqqnp6e4uLgcLY/OAAAAnklEQVRIx+3RSRLDIAxE0QYhAbGZPNu5/z0zrXHiqiz5W72FqhqtVuuXAl3iOV7iPV/iSsAqZa9BS7YOmMXnNNX4TWGxRMn3R6SxRNgy0bzXOW8EBO8SAClsPdB3psqlvG+Lw7ONXg/pTld52BjgSSkA3PV2OOemjIDcZQWgVvONw60q7sIpR38EnHPSMDQ4MjDjLPozhAkGrVbr/z0ANjAF4AcbXmYAAAAASUVORK5CYII=" alt="" style="width:20px;margin-right:5px;display:block"></div>
                    <div class="mx-cell__bd">
                        <p>标题文字</p>
                    </div>
                    <div class="mx-cell__ft">说明文字</div>
                </div>
            </div>
        

            <div class="mx-cells__title">带跳转的列表项</div>
            <div class="mx-cells">
                <a class="mx-cell mx-cell_access" href="javascript:;">
                    <div class="mx-cell__bd">
                        <p>cell standard</p>
                    </div>
                    <div class="mx-cell__ft">
                    </div>
                </a>
                <a class="mx-cell mx-cell_access" href="javascript:;">
                    <div class="mx-cell__bd">
                        <p>cell standard</p>
                    </div>
                    <div class="mx-cell__ft">
                    </div>
                </a>
            </div>
        

            <div class="mx-cells__title">带说明、跳转的列表项</div>
            <div class="mx-cells">
                <a class="mx-cell mx-cell_access" href="javascript:;">
                    <div class="mx-cell__bd">
                        <p>cell standard</p>
                    </div>
                    <div class="mx-cell__ft">说明文字</div>
                </a>
                <a class="mx-cell mx-cell_access" href="javascript:;">
                    <div class="mx-cell__bd">
                        <p>cell standard</p>
                    </div>
                    <div class="mx-cell__ft">说明文字</div>
                </a>
            </div>
        

            <div class="mx-cells__title">带图标、说明、跳转的列表项</div>
            <div class="mx-cells">

                <a class="mx-cell mx-cell_access" href="javascript:;">
                    <div class="mx-cell__hd"><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC4AAAAuCAMAAABgZ9sFAAAAVFBMVEXx8fHMzMzr6+vn5+fv7+/t7e3d3d2+vr7W1tbHx8eysrKdnZ3p6enk5OTR0dG7u7u3t7ejo6PY2Njh4eHf39/T09PExMSvr6+goKCqqqqnp6e4uLgcLY/OAAAAnklEQVRIx+3RSRLDIAxE0QYhAbGZPNu5/z0zrXHiqiz5W72FqhqtVuuXAl3iOV7iPV/iSsAqZa9BS7YOmMXnNNX4TWGxRMn3R6SxRNgy0bzXOW8EBO8SAClsPdB3psqlvG+Lw7ONXg/pTld52BjgSSkA3PV2OOemjIDcZQWgVvONw60q7sIpR38EnHPSMDQ4MjDjLPozhAkGrVbr/z0ANjAF4AcbXmYAAAAASUVORK5CYII=" alt="" style="width:20px;margin-right:5px;display:block"></div>
                    <div class="mx-cell__bd">
                        <p>cell standard</p>
                    </div>
                    <div class="mx-cell__ft">说明文字</div>
                </a>
                <a class="mx-cell mx-cell_access" href="javascript:;">
                    <div class="mx-cell__hd"><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC4AAAAuCAMAAABgZ9sFAAAAVFBMVEXx8fHMzMzr6+vn5+fv7+/t7e3d3d2+vr7W1tbHx8eysrKdnZ3p6enk5OTR0dG7u7u3t7ejo6PY2Njh4eHf39/T09PExMSvr6+goKCqqqqnp6e4uLgcLY/OAAAAnklEQVRIx+3RSRLDIAxE0QYhAbGZPNu5/z0zrXHiqiz5W72FqhqtVuuXAl3iOV7iPV/iSsAqZa9BS7YOmMXnNNX4TWGxRMn3R6SxRNgy0bzXOW8EBO8SAClsPdB3psqlvG+Lw7ONXg/pTld52BjgSSkA3PV2OOemjIDcZQWgVvONw60q7sIpR38EnHPSMDQ4MjDjLPozhAkGrVbr/z0ANjAF4AcbXmYAAAAASUVORK5CYII=" alt="" style="width:20px;margin-right:5px;display:block"></div>
                    <div class="mx-cell__bd">
                        <p>cell standard</p>
                    </div>
                    <div class="mx-cell__ft">说明文字</div>
                </a>
            </div>