zoukankan      html  css  js  c++  java
  • CSS 优先级 初始化

    越精细,越优先

    初始化的意义,没有声明CSS的裸标签,在不同的游览器下,会有不同的显示方法。

    为了防止意外的显示,初始化CSS是很好的习惯。减少不兼容的情况。

    腾讯QQ官网(http://www.qq.com)样式初始化

    body,ol,ul,h1,h2,h3,h4,h5,h6,p,th,td,dl,dd,form,fieldset,legend,input,textarea,select{margin:0;padding:0}
    body{font:12px"宋体","Arial Narrow",HELVETICA;background:#fff;-webkit-text-size-adjust:100%;}
    a{color:#2d374b;text-decoration:none}
    a:hover{color:#cd0200;text-decoration:underline}
    em{font-style:normal}
    li{list-style:none}
    img{border:0;vertical-align:middle}
    table{border-collapse:collapse;border-spacing:0}
    p{word-wrap:break-word}

    新浪官网(http://www.sina.com.cn/)样式初始化

    body,ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,fieldset,table,td,img,div{margin:0;padding:0;border:0;}
    body{background:#fff;color:#333;font-size:12px; margin-top:5px;font-family:"SimSun","宋体","Arial Narrow";}
     
    ul,ol{list-style-type:none;}
    select,input,img,select{vertical-align:middle;}
     
    a{text-decoration:none;}
    a:link{color:#009;}
    a:visited{color:#800080;}
    a:hover,a:active,a:focus{color:#c00;text-decoration:underline;}

    淘宝官网(http://www.taobao.com/)样式初始化(淘宝的样式是经过压缩的,我自己拷下来格式化过的)

    body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin:0; padding:0; }
    body, button, input, select, textarea { font:12px/1.5tahoma, arial, 5b8b4f53; }
    h1, h2, h3, h4, h5, h6{ font-size:100%; }
    address, cite, dfn, em, var { font-style:normal; }
    code, kbd, pre, samp { font-family:couriernew, courier, monospace; }
    small{ font-size:12px; }
    ul, ol { list-style:none; }
    a { text-decoration:none; }
    a:hover { text-decoration:underline; }
    sup { vertical-align:text-top; }
    sub{ vertical-align:text-bottom; }
    legend { color:#000; }
    fieldset, img { border:0; }
    button, input, select, textarea { font-size:100%; }
    table { border-collapse:collapse; border-spacing:0; }

    网易官网(http://www.163.com/)样式初始化

    html {overflow-y:scroll;}
    body {margin:0; padding:29px00; font:12px"5B8B4F53",sans-serif;background:#ffffff;}
    div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,blockquote,p{padding:0; margin:0;}
    table,td,tr,th{font-size:12px;}
    li{list-style-type:none;}
    img{vertical-align:top;border:0;}
    ol,ul {list-style:none;}
    h1,h2,h3,h4,h5,h6{font-size:12px; font-weight:normal;}
    address,cite,code,em,th {font-weight:normal; font-style:normal;}


    下面我贴出一段本站的CSS初始化的代码,当然,这并不是最好的写法,大家可以根据自己的习惯和喜好自行删减或增加!也欢迎大家提出更好的建议。


    body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td { margin:0; padding:0; }
    body { font-size:12px; color:#666; font-family:Verdana, Microsoft YaHei, Simsun; background:#fff; line-height:24px; }
    fieldset, img { border:0; }
    ol, ul { list-style:none; }
    h1, h2, h3, h4, h5, h6{ font-size:100%; }
    em { font-style:normal; }
    input, button, select, textarea { outline:none; }
    textarea { resize:none; } //禁用了文本的拖拉,尤其在谷歌下
    p{ text-align:justify; text-justify:distribute;} //为了使文本段落左右两边对齐

    a { color: #666; text-decoration:none; }
    a:hover { color: #f60; text-decoration:none; }

  • 相关阅读:
    字符串替换
    字符串查找
    字符串比较
    字节与字符串相互转换
    1365. How Many Numbers Are Smaller Than the Current Number
    1486. XOR Operation in an Array
    1431. Kids With the Greatest Number of Candies
    1470. Shuffle the Array
    1480. Running Sum of 1d Array
    【STM32H7教程】第56章 STM32H7的DMA2D应用之刷色块,位图和Alpha混合
  • 原文地址:https://www.cnblogs.com/zy2012/p/3730002.html
Copyright © 2011-2022 走看看