ブラウザリセットCSS
すべてのブラウザはデフォルトのスタイルを提供しています。
その上に独自のスタイルを積み重ねていきます。
しかし、デフォルトのスタイルはブラウザによってさまざま。
この上に独自のスタイルを積み重ねていくとブラウザによって思い通りの表示にならない事があります。
そこで、主要なブラウザを一貫性のある中立なスタイルにリセットすることが有効です。
それを簡単に実装する方法があります。
YUIライブラリのCSSを適用します。適用するには、独自のCSSの前に以下のリンクを追加するだけです。
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.4.1/build/cssreset/cssreset-min.css">
▼CSSの内容はこちら
/*
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
}
詳細はこちら→http://developer.yahoo.com/yui/reset/
フォントリセットCSS
それぞれのブラウザによるフォントの表示方法（特にフォントサイズ）には一貫性がありません。
が、ここでもYUIライブラリのフォント正規化CSSが利用できます。
このCSSは最近の主要ブラウザにおけるフォントを正規化してくれます。
適用するには、独自のCSSの前に以下のリンクを追加するだけです。
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.4.1/build/cssfonts/cssfonts-min.css">
▼CSSの内容はこちら
/*
YUI 3.4.1 (build 4118)
Copyright 2011 Yahoo! Inc. All rights reserved.
Licensed under the BSD License.
http://yuilibrary.com/license/
*/
body{
font:13px/1.231 arial,helvetica,clean,sans-serif;
*font-size:small;
*font:x-small
}
select,input,button,textarea{
font:99% arial,helvetica,clean,sans-serif
}
table{
font-size:inherit;
font:100%
}
pre,code,kbd,samp,tt{
font-family:monospace;
*font-size:108%;
line-height:100%
}
