zoukankan      html  css  js  c++  java
  • 为什么要Cssreset

    1、CssReset是什么?
    由于html标签在各浏览器的默认样式解析出来的有所不同。例如<ul>标签在IE、firefox、chrome浏览器下默认边距是不一样的。
    各浏览器的默认样,会给我们的页面带来一定的麻烦。同一个标签却显示出不同的效果。所以这就需要统一设置所有浏览器的默认样式。
    每个项目都应该会有一个默认样式,这就是cssreset。
    例:
    button在各浏览器的样式不同


    2、CssReset常用的属性有哪些?
    (1)、padding、margin;
    (2)、border、border-collapse;
    (3)、list-style
    (4)、font-size
    ……
    3、全局重置
    * { padding: 0; margin: 0; border: 0; }
    虽然能全部重置,但由于性能较低,不推荐使用。
    因为*需要遍历整个DOM树,当页面节点较多时,会影响页面的渲染性能。
    通常我们会选中YUI的reset
    4、Yahoo(YUI) CSS Reset:

    /*
    YUI 3.4.1 (build 4118)
    Copyright 2011 Yahoo! Inc. All rights reserved.
    Licensed under the BSD License.
    http://yuilibrary.com/license/
    */
    
    html{color:#000;background:#FFF}
    
    body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}
    
    table{border-collapse:collapse;border-spacing:0}
    
    fieldset,img{border:0}
    
    address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}
    
    ol,ul{list-style:none}
    
    caption,th{text-align:left}
    
    h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}
    
    q:before,q:after{content:''}
    
    abbr,acronym{border:0;font-variant:normal}
    
    sup{vertical-align:text-top}
    
    sub{vertical-align:text-bottom}
    
    input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit}
    
    input,textarea,select{*font-size:100%}
    
    legend{color:#000}
    

      

  • 相关阅读:
    linux常用脚本
    shell学习笔记
    Linux常用命令List
    Centos7部署Zabbix
    centos7安装nagios步骤
    nagios报错HTTP WARNING: HTTP/1.1 403 Forbidden解决方法
    U盘安装CentOS7
    Thread线程控制之sleep、join、setDaemon方法的用处
    EfficientDet框架详解 | 目前最高最快最小模型,可扩缩且高效的目标检测(附源码下载)
    ubuntu18.04 安装多版本cuda ,原来版本为9.0,在新增8.0
  • 原文地址:https://www.cnblogs.com/web369/p/Cssreset.html
Copyright © 2011-2022 走看看