CSS の名前付けは、小文字の英単語または組み合わせで名前が付けられ、単語は "-" で接続されます。一般的に使用される CSS の名前付け仕様には、テキストの名前付け仕様、ページ構造の名前付け仕様、ナビゲーションの名前付け、および関数の名前付けが含まれます。
CSS の名前付けでは、通常、小文字の英単語または名前の組み合わせが使用され、単語は「-」で区切られ、一目で理解できる簡単な単語以外は省略されません。次に、CSS で一般的に使用される命名規則を記事内でいくつか紹介します。皆様のお役に立てれば幸いです。
[推奨コース: CSS チュートリアル]
テキストの命名規則
index.css: 通常、スタイルの作成に使用されます。ホーム ページの
head.css: ヘッド スタイル。複数のページ ヘッダーが同じデザイン スタイルを持つ場合に使用されます。
base.css: 共有スタイル。
style.css: 独立したページで使用されるスタイル ファイル。
global.css: ページ スタイルの基礎となるグローバル パブリック スタイル。ページに含める必要があります。
layout.css: レイアウト、レイアウト スタイル。一般的なタイプが多数ある場合に使用され、一般にホームページ ページと製品ページで使用されます。
module.css: モジュール。製品ページに使用されます。他のスタイルと一緒に使用できます。
master.css: メイン スタイル シート
columns.css: 列スタイル
themes.css: メイン スタイル
forms.css: フォーム スタイル
mend.css: パッチ、上記のスタイルに基づいた非公開化パッチ。
ページ構造の名前:
page: ページ全体を表し、最も外側のレイヤーに使用されます。
wrap: coat、すべての要素をまとめてラップする周辺パッケージ。最外層に使用されます。
wrapper: ページ周辺機器全体のレイアウト幅を制御します。最外層に使用されます。
コンテナ: コンテナ全体、最も外側の
head に使用、ヘッダー: ヘッダー領域、ヘッダーに使用
nav: ナビゲーション バー
content: コンテンツ、最も重要Web サイトのコンテンツ領域。Web ページの中央の本文に使用されます。
main: Web サイトのメイン領域 (最も重要な位置を示します)。中央のメイン コンテンツに使用されます。
列: 列
サイドバー: サイドバー
フッター、フッター: フッター、フッター。 Web サイト上の一部の追加情報配置領域 (または名前付き著作権) は下部で使用されます。
ナビゲーションの名前付け:
nav、navbar、navigation、nav-wrapper:ナビゲーション バーまたはナビゲーション パッケージ。水平ナビゲーションを表します。
topnav: トップ ナビゲーション
mainbav: メイン ナビゲーション
subnav: サブ ナビゲーション
sidebar: サイド ナビゲーション
leftsidebar または sidebar_a: 左側のナビゲーション
rightsidebar または sidebar_b: 右のナビゲーション
title: タイトル
summary: 概要
menu:メニュー、領域には一般リンクとメニューが含まれます
submenu: サブメニュー
drop: ドロップダウン
dorpmenu: ドロップダウン メニュー
links: リンク メニュー
関数の名前:
logo: Web サイトのロゴをマークします
banner: スローガン、広告バナー、トップ広告バナー
login : ログイン、(ログイン フォーム: form-login など)
loginbar: ログイン バー
register: 登録
tool、ツールバー: ツールバー
search : search
searchbar: 検索バー
searchlnput: 検索入力ボックス
shop: 現在のリボンを示します
#icon: 小さなアイコンlabel: 商標 homepage：ホームページsubpage：第 2 レベルのページのサブページhot：ホット スポットlist：記事リスト、(例: ニュース リスト: list -news) scroll: スクロール tab: タグ sitemap: サイト マップ msg または message: プロンプト メッセージcurrent : 現在の joinus: 参加 status: ステータス btn: ボタン (例: 検索ボタンは次のように記述できます: btn -search) tips : ヒントnote: メモギルド: ガイドarr、矢印: マーク矢印サービス:サービスブレッドクラム: (つまり、ページの場所のナビゲーション プロンプト) download:ダウンロードvote:投票siteinfo:Web サイト情報partner：パートナーlink, friendslink：フレンドリーリンクcopyright：著作権情報siteinfoCredits：クレジットsiteinfoLegal：法的情報