CSSを整理して高品質なCSSコードを書く方法_html/css_WEB-ITnose

！ css
のまとめ方1: CSS API
は基本部分に属し、この部分の能力は「正誤」で判断されます。
たとえば、テキストを赤に設定するには、color: red のみを使用できます。この書き方は正しく、他の書き方は間違っています。

2: CSS フレームワーク
「正しい」「間違っている」を判断に使用することはできません。「良い」「より良い」「悪い」「非常に良い」などの言葉を使用して判断します。
機能ごとに分割：フォントを制御するCSSはfont.cssファイルに集中しています。
カラーを制御するCSSはcolor.cssファイルに集中しています。
レイアウトを制御するCSSはlayout.cssファイルに集中しています。
ブロックで分割：headのCSSをhead.cssに配置します。
foot.css に底部を配置します。
サイドバーをsidebar.cssに配置します。
main.cssに本文を入れます。

！ ！さまざまな視点からの組織手法には、それぞれ独自の理由があり、それぞれの欠点や利点もあります。

CSS を整理する私のお気に入りの方法:base.css+common.css+page.css。
Base (移植性が高い)
(Base は 3 つのレイヤーの最下位であり、CSS リセット機能と最小の粒度の共通クラスであるメタ サブクラスを提供します。このレイヤーはすべてのページによって参照されます。
はページ スタイルに必要です。依存関係。どのスタイルのデザインでも参照できるため、ベースレイヤーは合理的で普遍的なものになるように努める必要があります。
\\家の基礎、およびベースレイヤーに分けられます。ページ。これら 3 つは並列構造ではなく、積層構造であることに注意してください。
共通 (平均的な移植性)
(bommon は 3 つの中間に位置します。ページ内の要素を、比較的独立した機能とスタイルを持つ小さな「モジュール」に分割できます。
これらの「モジュール」の一部は、繰り返しの多い多数の「モジュール」をコンポーネントとして扱うことができます。 Web サイト内の再利用性の高いモジュールをコンポーネントとして配置します。共通レイヤーです。
￥￥ 家のドアや窓。 Web サイトの共通レイヤーは 1 つの common.css ファイルに配置されるか、common_form.css などの複数のファイルに分割されます。 common_imageList.cssは、ウェブサイトのスケールに従って決定する必要があります。メンテナンスを容易にするためのブロック:
/*ホームページ*/
.test1{}
.test2{}
/*会社概要*/
。test3{}

.test4{}

/*お問い合わせ*/
.test5{}
.test6{}
! page.css は可能な限り合理化する必要があります。これは、ベースレイヤーと共通レイヤーの CSS で解決できます)