Css Reset（リセット）仕上げ

CSSリセットとは何ですか?同僚の中にはこれを「CSS リセット」と呼ぶ人もいれば、「デフォルト CSS」と呼ぶ人もいるかもしれません...
元のアドレスを読むと、Css Reset について新たな理解が得られると思います

...

PS:

プログラム コード。
* {
パディング: 0;
マージン: 0;
これ

は最も一般的に使用される Css リセットですが、ここには多くの問題があります。

元の記事の最初の部分では、Css と各ブラウザの CSS ルールの違いについて詳しく説明されています。「Css Reset」は、互換性と統一性を考慮して作成されています。「Css Reset」を正しく効果的に使用すると、時間とコストを節約できます。ある程度。

以下は、いくつかの種類の CSS リセットについて簡単に説明したものであり、一般的な意味しか理解できません。ご容赦ください

。

ミニマルなリセット [バージョン 1]

私たちがよく使う

プログラムコード

* {
パディング: 0;
マージン: 0;
}

ミニマルなリセット [バージョン 2]
border:0 の設計は少し信頼性が低く、

プログラム コード

* {
パディング: 0;
マージン: 0;
境界線: 0;
}

ミニマルなリセット [バージョン 3]
もちろん、これは

プログラム コードの一部のデフォルト スタイルと競合するため、お勧めできません。
* {
概要: 0;
パディング: 0;
マージン: 0;
境界線: 0;
}

凝縮されたユニバーサルリセット
これは作成者が現在好んでいる記述方法であり、比較的一般的なブラウザ スタイルの統一性を保証します。

プログラムコード
* {
垂直配置: ベースラインベースライン;
フォントの太さ: 継承;
フォントファミリー: 継承;
フォントスタイル: 継承;
フォントサイズ: 100%;
境界線: 0 なし。
概要: 0;
パディング: 0;
マージン: 0;
}

貧乏人のリセット

プログラム コードが

一部のサイトでよく見られます。

html、本文{
パディング: 0;
マージン: 0;
}
html {
フォントサイズ: 1em;
}
体 {
フォントサイズ: 100%;
}
a img、:link img、:visited img {
境界線: 0;
}

ショーン・インマンのグローバル・リセット
著者は、Shaun がこの種の Css Reset を作成することに特定の目的があり、そのようなルールは IE、Firefox、その他の

プログラム コードなど、一般的に使用される重要なブラウザーを対象としていると考えています。
ボディ、div、dl、dt、dd、ul、ol、li、h1、h2、h3、h4、h5、h6、pre、
フォーム、フィールドセット、入力、p、blockquote、テーブル、th、td、埋め込み、オブジェクト {
パディング: 0;
マージン: 0;
}
テーブル {
境界崩壊: 崩壊;
境界線の間隔: 0;
}
フィールドセット、画像、略語 {
境界線: 0;
}
アドレス、キャプション、引用、コード、dfn、em、
h1、h2、h3、h4、h5、h6、strong、th、var {
フォントの太さ: 通常;
フォントスタイル: 通常;
}
ウル {
リストスタイル: なし;
}
キャプション、th {
テキスト整列: 左;
}
h1、h2、h3、h4、h5、h6 {
フォントサイズ: 1.0em;
}
q:前、q:後 {
コンテンツ： '';
}
a、インス{
テキスト装飾: なし。
}

Yahoo CSS リセット

yahooの人が書いたリセットの

プログラムコードが

ボディ、div、dl、dt、dd、ul、ol、li、h1、h2、h3、h4、h5、h6、pre、form、
フィールドセット、入力、テキストエリア、p、ブロック引用、th、td {
パディング: 0;
マージン: 0;
}
テーブル {
境界崩壊: 崩壊;
境界線の間隔: 0;
}
フィールドセット、画像 {
境界線: 0;
}
アドレス,キャプション,引用,コード,dfn,em,strong,th,var {
フォントの太さ: 通常;
フォントスタイル: 通常;
}
オル、ウル {
リストスタイル: なし;
}
キャプション、th {
テキスト整列: 左;
}
h1、h2、h3、h4、h5、h6 {
フォントの太さ: 通常;
フォントサイズ: 100%;
}
q:前、q:後 {
コンテンツ：'';
}
略語、頭字語 { 境界: 0;
}

Erik Meyer の CSS リセット
著者は Erik Meyer のコードを再配置しましたが、この Css Reset セットは業界で最も一般的に使用されている

プログラム コード

html、body、div、span、アプレット、オブジェクト、iframe、table、caption、tbody、tfoot、thead、tr、th、td、
del、dfn、em、フォント、img、ins、kbd、q、s、samp、小さい、ストライク、強い、サブ、sup、tt、var、
h1、h2、h3、h4、h5、h6、p、blockquote、pre、a、abbr、頭字語、アドレス、big、cite、code、
dl、dt、dd、ol、ul、li、フィールドセット、フォーム、ラベル、凡例 {
垂直配置: ベースラインベースライン;
フォントファミリー: 継承;
フォントの太さ: 継承;
フォントスタイル: 継承;
フォントサイズ: 100%;
概要: 0;
パディング: 0;
マージン: 0;
境界線: 0;
}
/* フォーカス スタイルを定義することを忘れないでください。 */
：集中 {
概要: 0;
}
体 {
背景: 白;
行の高さ: 1;
色: 黒;
}
オル、ウル{
リストスタイル: なし;
}
/* テーブルのマークアップには依然として cellpacing="0" が必要です */
テーブル {
ボーダー折りたたみ: 分離;
境界線の間隔: 0;
}
キャプション、th、td {
フォントの太さ: 通常;
テキスト整列: 左;
}
/* <q> と <blockquote> から引用符 (") を削除します */
blockquote:before、blockquote:after、q:before、q:after {
コンテンツ： "";
}
ブロッククォート、q {
引用符: "" "";
}

コンデンス・マイヤー・リセット

プログラム コード

の修正と改良です

ボディ、div、dl、dt、dd、ul、ol、li、h1、h2、h3、h4、h5、h6、
pre、form、fieldset、input、textarea、p、blockquote、th、td {
パディング: 0;
マージン: 0;
}
フィールドセット、画像 {
境界線: 0;
}
テーブル {
境界崩壊: 崩壊;
境界線の間隔: 0;
}
オル、ウル{
リストスタイル: なし;
}
アドレス、キャプション、引用、コード、dfn、em、strong、th、var {
フォントの太さ: 通常;
フォントスタイル: 通常;
}
キャプション、th {
テキスト整列: 左;
}
h1、h2、h3、h4、h5、h6 {
フォントの太さ: 通常;
フォントサイズ: 100%;
}
q:前、q:後 {
コンテンツ： '';
}
略語、頭字語 {
境界線: 0;
}