在剛開始學 CSS 的時後, Html Tag 的原有樣式要取消是最頭大的, 正好看到 Yahoo! UI library 有 Reset CSS, 正好就是取消這些功能, 連 CSS 壓縮(濾空白, 合成一行等.)都做好了.
在取得檔案後, yui/build/reset 裡面有兩個檔案, reset.css 和 reset-min.css, reset-min.css 就是壓縮過的 CSS file.
使用方法:
- 解壓縮後, 將 reset-min.css 拷到 css template path.
- 改個名字~ mv reset-min.css reset.css (隨興囉~)
- 在頁面 head 中加上 <link rel="stylesheet" type="text/css" href="reset.css" /> 這段語法即可.
reset.css file 內容也很簡單, 貼出來取用方便~
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;} 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%;} q:before,q:after{content:'';}
License: BSD License
詳可見: http://developer.yahoo.net/yui/license.txt
下面有另外做過中文處理的 CSS Reset
URL: http://tw.yimg.com/i/tw/hp/wd/lsm_generic.css
內容如下:
body { font-family:"Arial","MingLiU","PMingLiU"; font:"MingLiU","PMingLiU"; font-size:80%;margin:0 0 16px 0;padding:0;background:white; } fieldset{border-width:0;padding:0;margin:0;} input,select,option,textarea{font-family:"Arial","MingLiU","PMingLiU";} h1,h2,h3,h4,h5,h6,th,blockquote,p,ul,li,form,fieldset{margin:0;padding:0;font-size:100%;font-weight:normal;list-style:none;} th,td{text-align:left;font-weight:normal;} em,strong,b,i,cite,ins,small,big,tr,tr,table,tbody,abbr,s,del,address,dfn,kdb,code,var,{font-size:100%;font-style:normal;font-weight:normal;text-decoration:none;} a img{border:solid 0 red;} a{color:#0000bb;} a:visited{color:#3987C6;} a:hover{color:red} a:active{color:red}