css布局模仿14款不同电商平台的优惠券效果代码-html代码-BFW代码库

css布局模仿14款不同电商平台的优惠券效果代码

代码语言：html

所属分类：电商

代码描述：css布局模仿14款不同电商平台的优惠券效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!doctype html>
<html>

<head>
    <meta charset="utf-8">


    <style>
        @charset "utf-8";
        /* reset css start */
        html {
            margin: 0;
            height: 100%;
            -ms-text-size-adjust: 100%;
            -webkit-text-size-adjust: 100%;
            font-size: 62.5%;
        }

        body {
            width: 100%;
            max-width: 640px;
            min-width: 320px;
            height: 100%;
            margin: 0 auto;
            padding: 0;
            font-family: "Microsoft Yahei";
            font-size: 1.2rem;
            color: #a1a1a1;
            background: #f5f5f5;
            position: relative;
            overflow-x: hidden;
            -webkit-overflow-scrolling: touch;
        }

        a {
            text-decoration: none;
            color: #a1a1a1;
            background: transparent;
            -webkit-tap-highlight-color: transparent;
        }

            a:active {
                color: #8c88ff;
                border: none;
                outline: none;
            }

        article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
            display: block;
        }

        audio, canvas, progress, video {
            display: inline-block;
            vertical-align: baseline;
        }

            audio:not([controls]) {
                display: none;
                height: 0;
            }

        [hidden], template {
            display: none;
        }

        input {
            border: 1px solid #999;
            line-height: normal;
            vertical-align: middle;
            outline: 0;
            border-radius: 0;
            background: #FFFFFF;
            -webkit-appearance: none;
        }

            input[type="radio"], input[type="checkbox"] {
                padding: 0;
                -webkit-tap-highlight-color: rgba(255,255,255,0);
            }

            input[type="number"] {
                -moz-appearance: textfield;
            }

                input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {
                    margin: 0;
                    height: auto;
                    -webkit-appearance: none !important;
                }

            input[type="search"] {
                -webkit-appearance: textfield;
            }

                input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
                    -webkit-appearance: none;
                }

            input::-moz-placeholder, textarea::-moz-placeholder {
                font-size: 1.4rem;
                color: #c1c1c1;
            }

            input:-ms-input-placeholder, textarea:-ms-input-placeholder {
                font-size: 1.4rem;
                color: #c1c1c1;
            }

            input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
                font-size: 1.4rem;
                color: #c1c1c1;
            }

        button, input, optgroup, select, textarea {
            margin: 0;
            font: inherit;
            color: inherit;
            -webkit-tap-highlight-color: rgba(255,255,255,0);
        }

        button {
            border: none;
            overflow: visible;
        }

        button, select {
  .........完整代码请登录后点击上方下载按钮下载查看