• 企业400电话
  • 微网小程序
  • AI电话机器人
  • 电商代运营
  • 全 部 栏 目

    企业400电话 网络优化推广 AI电话机器人 呼叫中心 网站建设 商标✡知产 微网小程序 电商运营 彩铃•短信 增值拓展业务
    HTML 5 Reset Stylesheet
    这份css reset是在Eric Meyers的 CSS reset基础上修改出来的,特别针对HTML5调整了相应标签的初始化样式。

    /*
    html5doctor.com Reset Stylesheet
    v1.4
    2009-07-27
    Author: Richard Clark - http://richclarkdesign.com
    */

    html, body, div, span, object, iframe,
    h1, h2, h3, h4, h5, h6, p, blockquote, pre,
    abbr, address, cite, code,
    del, dfn, em, img, ins, kbd, q, samp,
    small, strong, sub, sup, var,
    b, i,
    dl, dt, dd, ol, ul, li,
    fieldset, form, label, legend,
    table, caption, tbody, tfoot, thead, tr, th, td,
    article, aside, dialog, figure, footer, header,
    hgroup, menu, nav, section,
    time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
    }
    body {
    line-height:1;
    }

    article, aside, dialog, figure, footer, header,
    hgroup, nav, section {
    display:block;
    }

    nav ul {
    list-style:none;
    }

    blockquote, q {
    quotes:none;
    }

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

    a {
    margin:0;
    padding:0;
    border:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
    }

    ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
    }

    mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
    }

    del {
    text-decoration: line-through;
    }

    abbr[title], dfn[title] {
    border-bottom:1px dotted #000;
    cursor:help;
    }

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

    hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
    }

    input, select {
    vertical-align:middle;
    }

    更新什么内容?
    移除了那些在HTML5中不被赞成使用的标签样式,例如<acronym><font><big>……添加了HTML5新增标签样式,移除了默认的padding、margin和border,确定指定了那些本应该当做块级元素来显示的元素的display属性为block。

    使用了属性选择器

    为<abbr><dfn>元素添加了属性选择器,这是为了在这两个元素有title这个属性的时候为他们指定一个样式,这点是从可访问性的角度考虑的。

    讨论

    在锚点上添加outline:0有很严重的可访问性问题,直接导致键盘导航失效。

    ins, mark在没有设置字体颜色的时候不必添加背景颜色。

    更多内容猛点这里:http://html5doctor.com/html-5-reset-stylesheet/
    上一篇:HTML 网页头部代码全清楚
    下一篇:Data URI和MHTML完整解决所有浏览器
  • 相关文章
  • 

    © 2016-2020 巨人网络通讯 版权所有

    《增值电信业务经营许可证》 苏ICP备15040257号-8

    HTML 5 Reset Stylesheet HTML,Reset,Stylesheet,HTML,Reset,