css3商品购物清单样式

html代码

<div class=\"container\">
  <div class=\"receipt\">
    <h2 class=\"receipt__title\">感谢您的惠顾！</h2>
    <p class=\"receipt__subtitle\">以下是您的购物清单，请保存好此票据。</p>
    <ul class=\"receipt__lines\">
      <li class=\"receipt__line\">
        <span class=\"receipt__line__item\">iPad mini 4（数量1）</span>
        <span class=\"receipt__line__price\">¥ 1699</span>  
      </li>
      <li class=\"receipt__line\">
        <span class=\"receipt__line__item\">type-C耳机（数量1）</span>
        <span class=\"receipt__line__price\">¥ 399</span>  
      </li>
      <li class=\"receipt__line\">
        <span class=\"receipt__line__item\">iPhone X edition（数量1）</span>
        <span class=\"receipt__line__price\">¥ 8288</span>  
      </li>
    </ul>
    <p class=\"receipt__total\">
      <span class=\"receipt__total__item\">合计：</span>
      <span class=\"receipt__total__price\">¥ 10386</span>
    </p>
    <p class=\"receipt__back\">
      <a href=\"#\">再去逛逛</a>
    </p>
  </div>
</div>