一般在做一些项目的时候,都需要一份reset.css和style.css两个文件。因此,我自己的reset.css会把一些共用的css全部放在里面,而不仅仅是reset。
我是用less写的。为的是方便调整。虽然现在开始学习sass了,但是一时还没有转换过来。
代码如下:
// Setting parameters by fungleo @WinWitdh:1200px; @BaseC:#555; @LinkC:#06f; @HoverC:#f60; @FontSize:13px; // reset by fungleo date 2015.08.27 @charset "UTF-8"; body,ul,ol,dl,dd,h1,h2,h3,h4,h5,h6,pre,form,fieldset,legend,input,button,textarea,p,blockquote,table,th,td,menu{margin:0;padding:0} table{border-collapse:collapse;border-spacing:0;table-layout:fixed} ul,ol,menu{list-style:none} fieldset,img{border:none} img,object,select,input,textarea,button{vertical-align:middle} input,textarea,select,address,caption,cite,code,dfn,em,i,b,strong,small,th,var,abbr{font-size:100%;font-style:normal} caption,th {text-align: left;} article,aside,footer,header,hgroup,nav,section,figure,figcaption {display: block;} code, kbd, pre, samp, tt { font-family: Consolas,"Courier New", Courier, monospace;} address, cite, dfn, em, var,i {font-style: normal;} blockquote, q {quotes: none;} blockquote:before, blockquote:after,q:before, q:after {content:"";content: none;} a { color:@LinkC; text-decoration:none;cursor: pointer; &:link,&:visited, &:active{color: @LinkC;} &:hover, &:focus {color:@HoverC; text-decoration:underline;outline:none;} &,span,i,em,u,strong,b,p,img,ul,li,div,dd,dt,dl,ol,table,th,td,h1,h2,h3,h4,h5,h6,input,textarea,button,small,select {cursor: pointer;.dz;} } abbr[title], acronym[title] {border-bottom: 1px dotted;cursor: help;} // base by fungleo html {min-width:@WinWitdh;overflow-y: scroll;} body {font-size: @FontSize;color: @BaseC;line-height: 2;} body,button, input, select, textarea {font-family:tahoma,Helvetica, Arial,"\5FAE\8F6F\96C5\9ED1";*font-family:"\5FAE\8F6F\96C5\9ED1";} h1 {font-size: @FontSize+10;} h2 {font-size: @FontSize+8;} h3 {font-size: @FontSize+6;} h4 {font-size: @FontSize+4;} h5 {font-size: @FontSize+2;} h6 {font-size: @FontSize;} hr {border: none;height: 1px;background: lighten(@BaseC,50%);} .fl {float: left;} .fr {float: right;} .tl {text-align: left;} .tr {text-align: right;} .tc {text-align: center;} .cf:before, .cf:after,.web:before, .web:after,.web_:before, .web_:after {content:"";display:table;} .cf:after,.web:after,.web_:after {clear:both;} .cf {zoom:1;} .web {width: @WinWitdh;margin-left: auto;margin-right: auto;zoom:1;} .web_ {min-width:@WinWitdh;width: 100%;zoom: 1;} .block {display: block;} .none {display:none} .clear {clear: both; } .dz(@time:0.25s){-webkit-transition: all @time ease-in-out;-moz-transition: all @time ease-in-out;-o-transition: all @time ease-in-out;transition: all @time ease-in-out;}