注册 登录 充值会员 退出
毕业设计 PHP源码
充值

css3商品购物清单样式

作者/代码整理:  (转载请附加本文地址,带有“懒人原生”字样的谢绝转载) 发布日期:2017-12-15
css3商品购物清单样式
一款简洁好看的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>