weui/src/example/steps/steps_vertical.html

A UI library by WeChat official design team, includes the most useful widgets/modules in mobile web applications.

<div class="page">
  <ul class="weui-steps weui-steps_vertical">
    <li class="weui-steps__item">
      <div class="weui-steps__item__inner">
        <strong class="weui-steps__item__title">标题</strong>
        <span class="weui-steps__item__desc">描述内容详情</span>
      </div>
    </li>
    <li class="weui-steps__item">
      <div class="weui-steps__item__inner">
        <strong class="weui-steps__item__title">标题</strong>
        <span class="weui-steps__item__desc">描述内容详情</span>
      </div>
    </li>
    <li class="weui-steps__item">
      <div class="weui-steps__item__inner">
        <strong class="weui-steps__item__title">标题</strong>
        <span class="weui-steps__item__desc">描述内容详情</span>
      </div>
    </li>
    <li class="weui-steps__item">
      <div class="weui-steps__item__inner">
        <strong class="weui-steps__item__title">标题</strong>
        <span class="weui-steps__item__desc">描述内容详情</span>
      </div>
    </li>
  </ul>
  <ul class="weui-steps weui-steps_vertical">
    <li class="weui-steps__item weui-steps__item_success">
      <div class="weui-steps__item__inner">
        <strong class="weui-steps__item__title">标题</strong>
        <span class="weui-steps__item__desc">描述内容详情</span>
      </div>
    </li>
    <li class="weui-steps__item">
      <div class="weui-steps__item__inner">
        <strong class="weui-steps__item__title">标题</strong>
        <span class="weui-steps__item__desc">描述内容详情</span>
      </div>
    </li>
    <li class="weui-steps__item">
      <div class="weui-steps__item__inner">
        <strong class="weui-steps__item__title">标题</strong>
        <span class="weui-steps__item__desc">描述内容详情</span>
      </div>
    </li>
    <li class="weui-steps__item">
      <div class="weui-steps__item__inner">
        <strong class="weui-steps__item__title">标题</strong>
        <span class="weui-steps__item__desc">描述内容详情</span>
      </div>
    </li>
  </ul>
  <ul class="weui-steps weui-steps_vertical">
    <li class="weui-steps__item weui-steps__item_success">
      <div class="weui-steps__item__inner">
        <strong class="weui-steps__item__title">标题</strong>
        <span class="weui-steps__item__desc">描述内容详情</span>
      </div>
    </li>
    <li class="weui-steps__item weui-steps__item_success weui-steps__item_icon-prev">
      <div class="weui-steps__item__inner">
        <strong class="weui-steps__item__title">标题</strong>
        <span class="weui-steps__item__desc">描述内容详情</span>
      </div>
    </li>
    <li class="weui-steps__item weui-steps__item_icon">
      <div class="weui-steps__item__inner">
        <strong class="weui-steps__item__title">标题</strong>
        <span class="weui-steps__item__desc">描述内容详情</span>
        <i class="weui-icon weui-icon-waiting weui-steps__icon"></i>
      </div>
    </li>
    <li class="weui-steps__item">
      <div class="weui-steps__item__inner">
        <strong class="weui-steps__item__title">标题</strong>
        <span class="weui-steps__item__desc">描述内容详情</span>
      </div>
    </li>
  </ul>
  <ul class="weui-steps weui-steps_vertical">
    <li class="weui-steps__item weui-steps__item_success">
      <div class="weui-steps__item__inner">
        <strong class="weui-steps__item__title">标题</strong>
        <span class="weui-steps__item__desc">描述内容详情</span>
      </div>
    </li>
    <li class="weui-steps__item weui-steps__item_success">
      <div class="weui-steps__item__inner">
        <strong class="weui-steps__item__title">标题</strong>
        <span class="weui-steps__item__desc">描述内容详情</span>
      </div>
    </li>
    <li class="weui-steps__item weui-steps__item_icon-prev weui-steps__item_success">
      <div class="weui-steps__item__inner">
        <strong class="weui-steps__item__title">标题</strong>
        <span class="weui-steps__item__desc">描述内容详情</span>
      </div>
    </li>
    <li class="weui-steps__item weui-steps__item_icon weui-steps__item_success">
      <div class="weui-steps__item__inner">
        <strong class="weui-steps__item__title">标题</strong>
        <span class="weui-steps__item__desc">描述内容详情</span>
        <i class="weui-icon weui-icon-success weui-steps__icon"></i>
      </div>
    </li>
  </ul>
</div>