ホームページ ウェブフロントエンド CSSチュートリアル それぞれどのファイルが正規化され、CSS がリセットされますか?違いは何ですか?

それぞれどのファイルが正規化され、CSS がリセットされますか?違いは何ですか?

Oct 26, 2021 pm 05:22 PM
css3

それぞれどのファイルが正規化され、CSS がリセットされますか?違いは何ですか?

正規化と CSS リセットの違い:

Normalize.css は単なる小さな CSS ファイルです従来の CSS リセットと比較して、Normalize.css は HTML5 用に用意された最新の高品質な代替手段です。つまり、Normalize.css は CSS リセットの代替手段です。

Normalize.css は貴重なデフォルト値を保護します

reset は、ほぼすべての要素にデフォルト スタイルを適用することで、要素に同じ視覚効果を強制します。対照的に、Normalize.css は多くの煩わしいブラウザ スタイルを維持します。これは、一般的なタイポグラフィ要素をすべて再スタイルする必要がなくなったことを意味します。要素のデフォルト値がブラウザごとに異なる場合、Normalize.css はそれらのスタイルの一貫性を保ち、可能な限り最新の標準に準拠するよう努めます。

Normalize.css はブラウザのバグを修正します

Normalize.css は、デスクトップおよびモバイル ブラウザの一般的なバグを修正します。これは多くの場合、リセットで実行できる範囲を超えています。これに関して、Normalize.css によって修正される問題には、HTML5 要素の表示設定、書式設定されたテキストのフォント サイズの問題、IE9 の SVG オーバーフロー、およびさまざまなブラウザーやオペレーティング システムで発生する多くのフォーム関連の問題が含まれます。

Normalize.css はデバッグ ツールを乱雑にしません

Reset の使用で最も厄介な部分は、ブラウザ デバッグ ツールの大きなセクションです。セグメントの継承チェーンです。 Normalize.css ではそのような問題は発生しません。これは、ガイドラインでの複数のセレクターの使用が非常に慎重であり、目的の要素にのみ意図的にスタイルを設定するためです。

Normalize.css はモジュール式です

このプロジェクトは、関連はあるものの独立した部分に分割されているため、どの要素が特定の要素に設定されているかを簡単かつ明確に把握できます。価値。これにより、アプリケーションの決して使用しない特定の部分 (フォームの一般化など) を選択的に削除できます。

Normalize.css には詳細なドキュメントがあります

Normalize.css のコードは、詳細かつ包括的なクロスブラウザーの調査とテストに基づいています。詳細なコードの説明はこのファイルにあり、さらに詳しくは Github Wiki で説明されています。これは、コードの各行が何を行うのか、コードが書かれた理由、ブラウザ間の違いを正確に知ることができ、独自のテストをより簡単に実行できることを意味します。

推奨学習: 「css ビデオ チュートリアル

以上がそれぞれどのファイルが正規化され、CSS がリセットされますか?違いは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

純粋な CSS3 で波の効果を実現するにはどうすればよいですか? (コード例) 純粋な CSS3 で波の効果を実現するにはどうすればよいですか? (コード例) Jun 28, 2022 pm 01:39 PM

純粋な CSS3 で波の効果を実現するにはどうすればよいですか?この記事ではSVGとCSSアニメーションを使って波のエフェクトを作成する方法をご紹介しますので、お役に立てれば幸いです。

CSSを上手に使って色々な変わった形のボタンを実現(コード付き) CSSを上手に使って色々な変わった形のボタンを実現(コード付き) Jul 19, 2022 am 11:28 AM

この記事では、頻繁に登場する様々な奇妙な形のボタンをCSSを使って簡単に実現する方法を紹介しますので、ぜひ参考にしてください。

スペースを取らずにCSS内の要素を非表示にする方法 スペースを取らずにCSS内の要素を非表示にする方法 Jun 01, 2022 pm 07:15 PM

2 つの方法: 1. display 属性を使用して、要素に「display:none;」スタイルを追加するだけです。 2. Position 属性と top 属性を使用して、要素の絶対位置を設定し、要素を非表示にします。要素に「position:absolute;top:-9999px;」スタイルを追加するだけです。

CSS3でレースボーダーを実装する方法 CSS3でレースボーダーを実装する方法 Sep 16, 2022 pm 07:11 PM

CSS では、border-image 属性を使用してレースの境界線を実現できます。 border-image 属性では、画像を使用して境界線を作成できます。つまり、境界線に背景画像を追加できます。背景画像をレース スタイルとして指定するだけで済みます。構文「border-image: url (画像パス) は、内側への画像境界線の幅。開始を繰り返すかどうか;"。

CSS3でマウスクリックで画像を拡大する方法 CSS3でマウスクリックで画像を拡大する方法 Apr 25, 2022 pm 04:52 PM

実装方法: 1. ":active" セレクターを使用して、画像上のマウス クリックの状態を選択します; 2. 変換属性とscale() 関数を使用して、画像の拡大効果を実現します。構文 "img:active {transform : スケール(x 軸倍率、y 軸倍率);}"。

テキストカルーセルと画像カルーセルも純粋な CSS を使用して実現できることがわかりました。 テキストカルーセルと画像カルーセルも純粋な CSS を使用して実現できることがわかりました。 Jun 10, 2022 pm 01:00 PM

テキストカルーセルと画像カルーセルを作成するにはどうすればよいですか?皆さんが最初に考えるのはjsを使うかどうかですが、実はテキストカルーセルや画像カルーセルも純粋なCSSでも実現できますので実装方法を見ていきましょう。

CSS3でアニメーションの回転速度を設定する方法 CSS3でアニメーションの回転速度を設定する方法 Apr 28, 2022 pm 04:32 PM

CSS3 では、「animation-timing-function」属性を使用してアニメーションの回転速度を設定できます。この属性は、アニメーションがサイクルを完了する方法を指定し、アニメーションの速度曲線を設定するために使用されます。構文は「element {アニメーションタイミング関数: 速度属性値;}"。

css3のアニメーション効果に変形はありますか? css3のアニメーション効果に変形はありますか? Apr 28, 2022 pm 02:20 PM

css3 のアニメーション効果には変形があり、「animation: アニメーション属性 @keyframes ..{..{transform: 変換属性}}」を使用して変形アニメーション効果を実現できます。アニメーション属性はアニメーション スタイルを設定するために使用され、変形スタイルを設定するには、transform 属性を使用します。

See all articles