フロントエンド開発仕様書(CSS)_html/css_WEB-ITnose

######構文 - タブの代わりに 2 つのスペース。 - セレクターをグループ化する場合は、個々のセレクターをそれぞれの行に配置します。 - 宣言ブロックの左中括弧の左側にスペースを残します。 - 宣言ブロックの右中括弧は、独自の行を占有します。 - 宣言文の後にはスペースを入れてください。 - より正確なエラー報告のために、各ステートメントは独立した行にあります。 - 最後の行を含め、すべての宣言ステートメントはセミコロンで終了します。 - カンマ区切りの属性値。カンマの後にスペースが挿入されます。 - rgb()、rgba()、hsla()、rect() 値内のカンマの後にスペースを追加しないでください。 - 属性値または色のパラメータについては、1 未満の 10 進数の先頭の 0 を省略します。 - 16 進数の値はすべて小文字です。 - 文書をスキャンするとき、その形式は区別しやすいためです。 - 可能な限り、省略された 16 進形式を使用してください。 - 選択範囲内のプロパティに二重引用符を追加します。 - margin:0px; の代わりに margin:0; など、0 の値に単位を指定することは避けてください。 ```/* 不正な CSS */.selector, .selector-secondary, .selector[type=text] {padding:15px; margin:0px 0px 15px; box-shadow:0px 1px 2px #CCC,inset 0 1px 0 #FFFFFF}/* 良い CSS */.selector,.selector-secondary,.selector[type="text"] {padding: 15px margin-bottom: 15px; ; 背景色: rgba(0,0,0,.5); ボックスシャドウ: 0 1px 2px #ccc, inset 0 1px 0 #fff;}```######宣言順序 1.位置 2。 Box model3.Typographic4.Visual```.declaration-order { /* 位置: 上: 0; 右: 0; z-index: 100; */ 表示: ブロック; 幅: 100 ピクセル; 高さ: 100 ピクセル; /* フォント: 通常の 13 ピクセル、ラインの高さ: 1.5; : center; /* ビジュアル */ ボーダー: 1px ソリッド #e5e5e5; /* その他 */ 不透明度: 1;}```###### @ import を使用してください。これは よりもはるかに遅いため、追加のリクエストの数が増えるだけでなく、予期しない問題が発生する可能性があります。 - 複数の 要素を使用します。 - Sass または Less などの CSS プリプロセッサを介して、複数の CSS ファイルを 1 つにコンパイルします。 - Rails、Jekyll、またはその他のシステムが提供する CSS ファイルのマージ機能を使用します。 ``````