ホームページ > 記事 > ウェブフロントエンド > CSS RESET スタイルをリセットすることはそれほど重要ですか? _html/css_WEB-ITnose
以前HTMLコードを書くときは、先頭にresetスタイルのreset.cssを追加することが多かったのですが、その内容は以下の通りです:
@charset "utf-8";html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; /*background: transparent;*/}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:200%; font-weight:normal;}:focus { outline: 0;}a{ text-decoration:none;}a:hover img{ border:none;}a:active{noOutline:expression(this.onFocus=this.blur());}/*清除浮动*/.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}.clearfix {display: inline-block;}/* Hides from IE-mac \*/* html .clearfix { height: 1%;}.clearfix {display: block;}/* End hide from IE-mac *//*png css hack for ie6*/*html img.png{ _background-image: expression(this.runtimeStyle.backgroundImage = "none",this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",this.src = "http://i0.itc.cn/20101019/848_0a785a7b_1118_4825_85dc_e8696988c94b_0.gif");}
最近ネット記事を読んでいると、あるような気がします。いくつかのリセットは無駄です。なぜ?
リセットの機能とは何ですか?
CSS リセットの機能は、さまざまなブラウザーの CSS スタイルの統一されたベースラインを持つことであり、このベースラインはむしろ「クリアランス」です。
時々、次のような他の人のウェブサイトのリセットを見かけます:
*{ margin:0; padding:0; }
そのような書き方は、あまりお勧めできません。
次に、リセット テーブルを見て、以下を見つけます:
1. div タグにはデフォルトでマージン値がありますか?パディングには価値があるのか?なぜ div{margin:0; padding:0;} 属性を適用しようと考えたのですか?答えは間違いなくそうではありません。
2. dt タグのデフォルトのマージンとパディングの値は 0 ですが、なぜそれらを使用する必要があるのでしょうか?
3. li タグにはデフォルトでマージン値がありますか?パディングには価値があるのか?いいえ!
4. code タグはインライン要素であり、実際にはマージンとパディングのリセットが含まれますが、これは不要です。
5. 1990 年代の 2 つのタグである fieldset と legend をウェブサイトで使用していますか?使用確率が1%未満のタグはリセットする必要はありません。
CSS は、いくつかの一般的に使用されるタグでのみリセットできます。ページで通常どのようなタグを使用しますか?
body, dl, dd, h1, h2, h3, h4, h5, h6, p, form{margin:0;} ol,ul{margin:0; padding:0;}
この種の CSS リセットは効率的かつ簡潔で、他のタグは削除できるので必要ありません。
もちろん、CSS リセットの長所と短所は言うまでもありませんが、CSS リセットについては十分に承知していると思いますが、やはり実際のプロジェクトに基づいて行う必要があります。
その後、私の上司は、reset.css の代わりに Normalize.css を使用することを勧めてくれました。使い方は後の記事で紹介します。
著者: 嵐の後の虹を見ましょう
出典: http://www.cnblogs.com/moqiutao/
この記事があなたの研究に役立つと思われる場合は、サポートと励ましをお願いします自分 。