• 第10天:CSS初始化操作


           在写页面过程中,每个浏览器都会有默认样式,为了避免浏览器的样式兼容问题,我们会在样式开始部分对常用标签进行重置样式。这样我们在写样式时,就不会有误差。常用的CSS标签初始化如下:

    @charset "UTF-8";
    /*css 初始化 */
    html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend, img { margin:0; padding:0; }
    fieldset, img,input,button { border:none; padding:0;margin:0;outline-style:none; }
    ul, ol { list-style:none; }
    input { padding-top:0; padding-bottom:0; font-family: "SimSun","宋体";}
    select, input { vertical-align:middle; }
    select, input, textarea { font-size:12px; margin:0; }
    textarea { resize:none; } /*防止拖动*/
    img {border:0; vertical-align:middle; }  /*  去掉图片低测默认的3像素空白缝隙*/
    table { border-collapse:collapse; }
    body {
        font:12px/150% Arial,Verdana,"\5b8b\4f53";
        color:#666;
        background:#fff
    }
    .clearfix:before,.clearfix:after{
        content:"";
        display:table;
    }
    .clearfix:after{clear:both;}/*清除浮动*/
    .clearfix{
        *zoom:1;/*IE/7/6*/
    }
    a{color:#666; text-decoration:none; }
    a:hover{color:#C81623;}
    h1,h2,h3,h4,h5,h6{text-decoration:none;font-weight:normal;font-size:100%;}
    s,i,em{font-style:normal;text-decoration:none;}
    .col-red{color: #C81623!important;}
    
    /*公共类*/
    .w {  /*版心 提取 */
        width: 1210px;margin:0 auto;
    }
    .fl {
        float:left
    }
    .fr {
        float:right
    }
    .al {
        text-align:left
    }
    .ac {
        text-align:center
    }
    .ar {
        text-align:right
    }
    .hide {
        display:none
    }

    并不是说每个页面的CSS样式初始化都要这样写,我们可以根据页面需要,设置部分公共样式,在后面写的过程中会方便很多,而且可以避免代码的重复性。
    附:
    今天写了个导航,出现了个奇怪的问题,思考了两个小时,到现在都还没解决。明明很简单的代码,看来看去都没有错误,不知道为何效果就是出不来。这个问题我需要时间再思考下,希望在梦中可以想通。今天先到这,晚安。
  • 相关阅读:
    刷题-力扣-152. 乘积最大子数组
    刷题-力扣-剑指 Offer II 088. 爬楼梯的最少成本
    刷题-力扣-剑指 Offer II 003. 前 n 个数字二进制中 1 的个数
    刷题-力扣-LCS 01. 下载插件
    刷题-力扣-剑指 Offer 10- II. 青蛙跳台阶问题
    20191107-3 beta week 2/2 Scrum立会报告+燃尽图 02
    beta week 2/2 Scrum立会报告+燃尽图 01
    版本控制报告
    20191031-9 beta week 1/2 Scrum立会报告+燃尽图 07
    扛把子组20191031-2 Beta阶段贡献分配规则
  • 原文地址:https://www.cnblogs.com/le220/p/7420800.html
Copyright © 2020-2023  润新知