zoukankan      html  css  js  c++  java
  • 移动端页面 css reset

    这个是通用的  css reset.这个版本适用于 移动端页面
    如果需要在 PC端使用,可以 修改 html{font-size: 10px;}为html{font-size: 12px;}
    其他地方不需要修改  
    =========================================
    @charset "utf-8";
    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,
    font,
    img,
    ins,
    kbd,
    q,
    s,
    samp,
    small,
    strike,
    strong,
    sub,
    sup,
    tt,
    var,
    dl,
    dt,
    dd,
    ol,
    ul,
    li,
    fieldset,
    form,
    label,
    legend,
    table,
    caption,
    tbody,
    tfoot,
    thead,
    tr,
    th,
    td {
        margin: 0;
        padding: 0;
        border: 0;
        outline: 0;
        font-weight: inherit;
        font-style: inherit;
        font-size: 100%;
        font-family: inherit;
        vertical-align: baseline;
         100%;
        height: 100%;
    }
     
    html {
        font-family: 'sans-serif', "Microsoft YaHei", "微软雅黑", "Tahoma", "Helvetica";
        font-size: 10px;
     
        background: #fff;
        -webkit-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
    }
     
    table {
        border-collapse: collapse;
        border-spacing: 0;
    }
     
    img {
        border: 0; max- 100%!important;
        vertical-align: middle;
    }
     
    address,
    caption,
    cite,
    code,
    dfn,
    i,
    em,
    strong,
    th,
    var {
        font-weight: normal;
        font-style: normal;
    }
     
    ol,
    ul {
        list-style: none;
    }
     
    a {
        text-decoration: none;
    }
     
    a:hover,
    a:focus {
        outline: none;
    }
     
    caption,
    th {
        text-align: left;
        font-weight: normal;
    }
     
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        font-weight: normal;
        font-size: 100%;
    }
     
    q:before,
    q:after {
        content: ”;
    }
     
    abbr,
    acronym {
        border: 0;
    }
     
    button,
    input,
    optgroup,
    select,
    textarea {
        margin: 0;
        font: inherit;
        color: inherit;
    }
     
    * {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
    }
     
    :before,
    :after {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
     
    input[type=search]::-webkit-search-cancel-button,
    input[type=search]::-webkit-search-decoration {
        -webkit-appearance: none;
    }
     
    article,
    aside,
    details,
    figcaption,
    figure,
    footer,
    header,
    hgroup,
    nav,
    section,
    summary {
        display: block;
    }
     
    @media screen and (min-100px){ /*  iPhone 4,5 */
     html{ font-size: 10px;}
    }
    @media screen and (min-320px){ /*  iPhone 4,5 */
     html{ font-size: 10px;}
    }
    @media screen and (min-375px){ /*  iPhone 6 */
     html{ font-size: 12px;}
    }
    @media screen and (min-414px){  /*  iPhone 6 plus */
     html{ font-size: 12px;}
    }
    @media screen and (min-600px){
        html{ font-size:14px;}
    }
     
    红色代码段是为了在不同分辨率手机上,字体缩放 
  • 相关阅读:
    jQuery Ajax 方法调用 Asp.Net WebService 的详细例子(原创)
    jQuery 访问WebService 返回复合类型列表
    Vista Media Center 开发之深入浅出 (一) Vista Media Center开发环境的搭建
    安装一个媒体解码器让 Windows Media Player 支持更多媒体格式
    静静期待 Windows 7 的到来
    集成 RealTek 声卡 在 Windows 7 有杂音、爆音的解决方法
    使用jQuery for Asp.Net 我的开发环境配置
    Windows 7 VHD 启动
    建立一个 C#.Net Windows Service 程序
    Windows server 2008 r2 简体中文180天评估版微软官方下载地址
  • 原文地址:https://www.cnblogs.com/leshao/p/5466921.html
Copyright © 2011-2022 走看看