partial.html 6.47 KB
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>如何获得限购码</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <meta http-equiv="cleartype" content="on">
    <meta content="telephone=no" name="format-detection" />
    <script type="text/javascript">
        (function(doc, win) {
            var docEl = doc.documentElement;
            (function() {
                var clientWidth = docEl.clientWidth;
                if (!clientWidth) {
                    return;
                }
                docEl.style.fontSize = 20 * (clientWidth / 320) + 'px';
            }());
        })(document, window);
    </script>
    <style>
    html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, .yoho-header .nav-back, .yoho-header .nav-home, .yoho-header .nav-btn {
        margin: 0;
        padding: 0;
        border: 0;
        font: inherit;
        font-size: 100%;
        vertical-align: baseline;
    }

    html {
        line-height: 1;
    }

    ol, ul {
        list-style: none;
    }

    table {
        border-collapse: collapse;
        border-spacing: 0;
    }

    caption, th, td {
        text-align: left;
        font-weight: normal;
        vertical-align: middle;
    }

    q, blockquote {
        quotes: none;
    }

    q:before, q:after, blockquote:before, blockquote:after {
        content: "";
        content: none;
    }

    a img {
        border: none;
    }

    article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary, .yoho-header .nav-back, .yoho-header .nav-home, .yoho-header .nav-btn {
        display: block;
    }
    /*Reset End*/

    .clearfix:after{
        content: '';
        display: table;
        clear: both;
    }

    * {
        -webkit-tap-highlight-color: rgba(0,0,0,0);
        -moz-tap-highlight-color: rgba(0,0,0,0);
        tap-highlight-color: rgba(0,0,0,0);
    }

    html, body {
        font-family: helvetica,Arial,"黑体";
        width: 100%;
        font-size: 12PX;
        line-height: 1.4;
    }

    button, input, select, textarea {
        font-size: 100%;
        margin: 0;
    }

    img {
        max-width: 100%;
        display: block;
        border: 0;
        margin: 0 auto;
    }

    a {
        text-decoration: none;
        outline: none;
        color: #000
    }

    a:link, a:visited, a:hover, a:actived{
        color: #000;
    }

    *:focus {
        outline: none;
    }

    .hide {
        display: none;
    }

    .overflow-hidden {
        overflow: hidden;
    }

    @font-face {
        font-family: "iconfont";
        src: url('../font/iconfont.eot'); /* IE9*/
        src: url('../font/iconfont.eot?#iefix') format('embedded-opentype'),
             url('../font/iconfont.woff') format('woff'),
             url('../font/iconfont.ttf') format('truetype'),
             url('../font/iconfont.svg#iconfont') format('svg'); /* iOS 4.1- */
    }

    .iconfont {
        font-family: "iconfont" !important;
        font-size: 16PX;
        font-style: normal;
        text-decoration: none;
        -webkit-font-smoothing: antialiased;
        -webkit-text-stroke-width: 0.2PX;
        -moz-osx-font-smoothing: grayscale;
    }
    .limit-help-page{
        padding: 0.7rem;
        color: #444;
    }
    .limit-help-page h2{
        font-size: 0.75rem;
        font-weight: bold;
    }
    .limit-help-page .method{
        display: block;
        width: 2.3rem;
        height: 0.875rem;
        line-height: 0.9rem;
        background-color: #444;
        color: #fff;
        border-radius: 0.5rem;
        text-align: center;
        margin: 0.5rem 0;
    }
    .limit-help-page li{
        font-size: 0.6rem;
    }
    .limit-help-page .intro-img{
        width: 100%;
        height: 5.5rem;
        background-size: 100%;
        background-repeat: no-repeat;
        margin: 0.5rem 0;
    }
    .limit-help-page .method-1 li:nth-child(1) .intro-img{
        background-image: url('img/1.png');
    }
    .limit-help-page .method-1 li:nth-child(2) .intro-img{
        background-image: url('img/2.png');
    }
    .limit-help-page .method-1 li:nth-child(3) .intro-img{
        background-image: url('img/3.png');
    }
    .limit-help-page .method-2 li:nth-child(1) .intro-img{
        background-image: url('img/4.png');
    }
    .limit-help-page .method-2 li:nth-child(2) .intro-img{
        background-image: url('img/5.png');
    }
    .limit-help-page .method-2 li:nth-child(3) .intro-img{
        background-image: url('img/6.png');
    }
    .limit-help-page .method-2 li:nth-child(4) .intro-img{
        background-image: url('img/7.png');
    }
    .limit-help-page .how li:nth-child(1) .intro-img{
        background-image: url('img/8.png');
    }
    .limit-help-page .how li:nth-child(2) .intro-img{
        background-image: url('img/9.png');
        margin-bottom: 0;
    }
    </style>

</head>
<body>
    <div class="limit-help-page yoho-page">
        <ul class="method-2">
            <li>1.在限定发售详情页点击参加排队赢取限购码图标。
                <div class="intro-img"></div>
            </li>
            <li>2.进入限定发售排队页面,点击参加排队。
                <div class="intro-img"></div>
            </li>
            <li>3.排队成功后凭用户个人信息作为抽奖凭证,等待开奖时间。
                <div class="intro-img"></div>
            </li>
            <li>4.开奖后,排队页面会公布中奖名单,限购码会直接发送至账户。
                <div class="intro-img"></div>
            </li>
        </ul>
        <h2>查看和使用限购码</h2>
        <ul class="how">
            <li>1.从个人中心进入我的限购码页面,可查看所获取的限购码。
                <div class="intro-img"></div>
            </li>
            <li>2.商品开售后,需要有限购码才有抢购资格,无法确保可以买到适合尺码,库存有限,抢完为止。
                <div class="intro-img"></div>
            </li>
        </ul>
    </div>
</body>
</html>