あなたのCSSをブラウザ全体で一貫させる方法

多分、このポストは最初にあなたのCSSを始める方法であるので、Firstの最初でなければなりません.その後、再び、あなたはそれがあなたがそうしていることを正確に理解することができるはずです.
コードのリセットは、一貫したベースラインにすべての要素のスタイルをリセットする規則の短いセットを示します.スタイリングがブラウザ間で一貫性がないので、それは必要です.あなたは、あなたが上にいるときあなたと台無しにするように、例えばテーブル要素のプレスタイリングのようなものが欲しくありません.

実践

私がCSSから始めたとき、最初はいつも書いてください.

 *{
    margin:0;
    padding:0;
 }

これは基本的なCSSリセットです.
異なったブラウザーの間で異なったスタイルで最も一般的な要素のいくつかは、ハイパーリンク(a＞)、イメージ(＜img＞)、見出し(＜h 1＞＜h 6＞)、およびさまざまな要素に与えられる余白である.ブラウザーがある量のパディングをほとんどすべてに加えることは、周知の事実です.
ブラウザ間のチェックアウトボタンの異なるスタイリングの例

異なる要素( headline , link , span , code , blockquote )のスタイルの設定例

すべてのブラウザは、デフォルトのHTML形式を持っており、検査モードで“ユーザーエージェントのスタイルシート”の下にそれを見ることができます.特定の要素にスタイルが追加されると、既定のブラウザー形式が上書きされます.

スクリプトをリセットする

私の好きなCSSのリセットスクリプトはhttp://html5doctor.comから1です

 html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote,  pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
     margin:0;
     padding:0;
     border:0;
     outline:0;
     font-size:100%;
     vertical-align:baseline;
     background:transparent;
 }

 body {
     line-height:1;
 }

 article,aside,details,figcaption,figure, footer,header,hgroup,menu,nav,section{ 
     display:block;
 }

 nav ul {
    list-style:none;
 }

 blockquote, q {
    quotes:none;
 }

 blockquote:before, blockquote:after, q:before, q:after {
    content:'';
    content:none;
 }

 a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
 }

 /* change colors to suit your needs */
 ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
 }

 /* change colors to suit your needs */
 mark {
    background-color:#ff9;
    color:#000; 
    font-style:italic;
    font-weight:bold;
 }

 del {
    text-decoration: line-through;
 }

 abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
 }

 table {
    border-collapse:collapse;
    border-spacing:0;
 }

 /* change border color to suit your needs */
 hr {
    display:block;
    height:1px;
    border:0;   
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
 }

 input, select {
    vertical-align:middle;
 }

定義されたスタイルのいくつかはかなり標準です(aのためのものと＜ul＞のために)、いくつかはアクセシビリティ(＜abbr＞と＜dfn＞のもの)を助けるために加えられます、そして、いくつかは余分(＜hr＞)を加えられます.
より多くのリセットスクリプトの一覧があります.

meyerweb、

carrer web、

yui library、

Simon Harte HTML5-Reset .

CSSリセットの代わりに、CSS Normalizeを使用する開発者もいます(そして、いくつかは「新しいリセット」として参照します).リセットはすべてを拭いて、プロジェクト“タブラRASA”を作るために使用されている間、正規化は、クロスブラウザのスタイルの矛盾を中和しながら良い実践を続けている.私は将来CSS正規化について書きます.それまではthis postをチェックします.

結論

それはあなたのCSSをリセットする必要はありませんが、ブラウザの前スタイリングとCSSのリセットの存在を意識することです.
この記事はもともとKolosek Blogに掲載されています.