zoukankan      html  css  js  c++  java
  • reset.css

    很多地方都提到过CSS Reset这个概念,而且细心的朋友会发现,许多大网站的CSS文件中也含有CSS Reset内容。

     

    CSS Reset是什么?

      其实简单的说就是重置浏览器的CSS默认属性。

     

    为什么要重置它?

      因为浏览器的品种很多,每个浏览器的默认样式也是不同的,比如<button>标签,在IE浏览器、Firefox浏览器以及Safari浏览器中的样式都是不同的,所以,通过重置button标签的CSS属性,然后再将它统一定义,就可以产生相同的显示效果。

     

    CSS Reset的内容是什么?

      最简单的CSS Reset内容寥寥几行就能完成:

     

      

    * { padding: 0; margin: 0; border: 0; }

    这个方法让所有的选择器的padding、margin和border都设置成0。也有内容更多的,比如YUI的CSS Reset内容:

     

      

    body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre, 
    form,fieldset,input,textarea,p,blockquote,th,td { 
    padding: 0; 
    margin: 0; 

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

    fieldset,img { 
    border: 0; 

    address,caption,cite,code,dfn,em,strong,th,var { 
    font-weight: normal; 
    font-style: normal; 

    ol,ul { 
    list-style: none; 

    caption,th { 
    text-align: left; 

    h1,h2,h3,h4,h5,h6 { 
    font-weight: normal; 
    font-size: 100%; 

    q:before,q:after { 
    content:''; 

    abbr,acronym { border: 0; 
    }

    以及国外名人Eric Meyer的CSS Reset内容:

     

      

    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, 
    b, u, i, center, dl, dt, dd, ol, ul, li, 
    fieldset, form, label, legend, 
    table, caption, tbody, tfoot, thead, tr, th, td { 
    margin: 0; 
    padding: 0; 
    rder: 0; 
    outline: 0; 
    font-size: 100%; 
    vertical-align: baseline; 
    ackground: transparent; 

    body { 
    line-height: 1; 

    ol, ul { 
    list-style: none; 

    blockquote, q { 
    quotes: none; 

    blockquote:before,blockquote:after, 
    q:before, q:after { 
    content: ''; 
    content: none; 

    /* remember to define focus styles! */ 
    :focus { 
    outline: 0;} 
    /* remember to highlight inserts somehow! */ 
    ins { 
    text-decoration: none; 

    del { 
    text-decoration: line-through; 

    /* tables still need 'cellspacing="0"' in the markup */ 
    table { 
    border-collapse: collapse; 
    border-spacing: 0; 
    }

    大家可以看得出来,这些内容方法不同,但功能大同小异,都是起到重置的作用,所以说CSS Reset是根据个人需求不同可以按需自定义的。


  • 相关阅读:
    Spring Cloud Hystrix Dashboard的使用 5.1.3
    Spring Cloud Hystrix 服务容错保护 5.1
    Spring Cloud Ribbon 客户端负载均衡 4.3
    Spring Cloud 如何实现服务间的调用 4.2.3
    hadoop3.1集成yarn ha
    hadoop3.1 hdfs的api使用
    hadoop3.1 ha高可用部署
    hadoop3.1 分布式集群部署
    hadoop3.1伪分布式部署
    KVM(八)使用 libvirt 迁移 QEMU/KVM 虚机和 Nova 虚机
  • 原文地址:https://www.cnblogs.com/youxin/p/2240435.html
Copyright © 2011-2022 走看看