ホームページ > 記事 > ウェブフロントエンド > CSSの命名と書き方の標準化
グローバル スタイル: global.css;
フレームレイアウト:layout.css;
フォントスタイル: font.css;
リンクスタイル: link.css;
印刷スタイル: print.css;
二。共通のクラス/ID 命名規則
ヘッダー: ヘッダー
コンテンツ: コンテンツ
コンテナ: コンテナ
メインナビゲーション: mainMenu
サブナビゲーション: サブメニュー
ロゴ: ロゴ
スローガン: バナー
タイトル: タイトル
サイドバー: サイドバー
アイコン: アイコン
注意: 注意
検索: 検索
ボタン: ボタン
ログイン: ログイン
リンク: リンク
情報ボックス: 管理
……
よく使用されるクラスの名前は、できる限り一般的な英単語に基づいて理解しやすくし、適切な場所に注釈を付ける必要があります。二次クラス/ID の命名には、複合書き込みモードが採用され、最後の単語の最初の文字は大文字にする必要があります。たとえば、「検索ボックス」は「searchInput」、「検索アイコン」は「searchIcon」、 「検索ボタン」「「searchBtn」という名前を付けました...
CSSの書き方と仕様書
1. 従来の執筆基準と手法
1. DOCTYPE を選択します:
移行: 要件が非常に緩い DTD で、HTML4.01 ロゴを引き続き使用できます (ただし、xhtml 記述方法に準拠する必要があります)。完全なコードは次のとおりです:
厳密: 厳密な DTD の場合、
などのプレゼンテーション層の識別子と属性は使用できません。完全なコードは次のとおりです:
フレームセット: フレーム ページ用に特別に設計された DTD。ページにフレームが含まれている場合は、この DTD を使用する必要があります。完全なコードは次のとおりです:
理想的な状況はもちろん厳密な DTD ですが、Web 標準に慣れていないほとんどのデザイナーにとって、現時点ではトランジショナル DTD (XHTML 1.0 Transitional) が理想的な選択です (トランジショナル DTD を使用しているこのサイトも含めて)。この DTD ではプレゼンテーション層の識別子、要素、属性も使用できるため、W3C コード検証に合格することも容易になります。
2. 言語と文字セットを指定します:
ドキュメントの言語を指定してください:
ブラウザーによって正しく解釈され、W3C コード検証に合格するには、すべての XHTML ドキュメントが使用するエンコード言語を次のように宣言する必要があります。 一般的に使用される言語定義:
; 標準 XML ドキュメント言語定義:
古いブラウザの言語定義:
文字セットを改善するには「utf-8」を使用することをお勧めします。
3. スタイルシートの呼び出し:
外部スタイルシート呼び出し: