CSS クラス、ID、および CSS ファイル名の共通の命名規則_html/css_WEB-ITnose

CSSクラス、ID、CSSファイル名の共通命名規則

(1) CSS共通命名規則

ヘッダー: header

コンテンツ: content/container

テール: footer

Navigation: nav

サイドバー：sidebar

カラム：column

ページ周辺コントロール全体レイアウト幅：wrapper

左右中央：左右中央

ログインバー：loginbar

ロゴ：ロゴ

広告：バナー

メインページ：main

ホットスポット: hot

ニュース: news

ダウンロード: download

サブナビゲーション: subnav は、5 年間かけて慎重に開発された UI フロントエンド フレームワークです。

メニュー：menu

コンテンツ：content

タブ：tab

記事一覧：list

プロンプト情報: msg

ヒント: ヒント

列のタイトル: title

参加: joinus

ガイド: guild

サービス:service

登録：regsiter

ステータス:status

投票:vote

パートナー:partner

(2) メモの書き込み:

/* Footer */

コンテンツエリア

/* End Footer */

(三)IDネーミング:

5年かけてじっくり開発したUIフロントエンドフレームワーク！

(1) ページ構造

コンテナ:container

ヘッダー:header

コンテンツ:content/container

ページフッター:footer

ナビゲーション:nav

サイドバー:sidebar

Column: コラム

ページ周辺制御全体のレイアウト幅:wrapper

左右中央:左右中央

(2)ナビゲーション

ナビゲーション:nav

メインナビゲーション:mainbav

サブナビゲーション:subnav

トップナビゲーション:topnav

サイドナビゲーション:sidebar

左ナビゲーション: leftsidebar

右ナビゲーション: rightsidebar

メニュー: menu

サブメニュー: submenu

タイトル: title

概要: summary

(3) 関数

ロゴ：ロゴ

広告: バナー

ログイン: ログイン

ログインバー: ログインバー

登録: 登録者

リボン: ショップ

タイトル: タイトル

参加: joinus

ステータス: 慎重に開発されたステータス5 今年の UI フロントエンド フレームワーク!

ボタン: btn

スクロール: スクロール

タブ: tab

記事リスト: list

プロンプトメッセージ: msg

現在: current

ヒント: ヒント

アイコン: icon

注意: 注意

ガイド: ギルド

サービス: サービス

ホットスポット: ホット

ニュース: ニュース

ダウンロード: ダウンロード

投票: 投票

パートナー: パートナー

フレンドリーリンク: リンク

著作権: copyright

(4) クラス名:

.ff8600 { color: #ff8600 }

(2) フォントサイズ、「font+font size」を名前として直接使用します。 as

.font12px { font-size: 12px; }

.font9pt {font-size : 9pt; }

(3) 配置スタイル、

.left { float などの配置ターゲットの英語名を使用します。 :left; }

.bottom { float:bottom; } (4) タイトル バーのスタイル、「カテゴリ + 関数」の名前を使用します (例:

.barnews { }

.barproduct { }

)。

1. 常に小文字にする

2. できるだけ英語を使用する

3. 中国語のバーやアンダースコアを追加しないでください

4. 一目で理解できる単語以外は省略しないようにしてください。 . 5年かけてじっくり開発したUIフロントエンドフレームワーク！

メイン master.css

モジュール module.css

基本的に共通のbase.css

レイアウト、レイアウトlayout.css

Themes.css

Columns.css

Text font.css

フォーム.css

patch mend.css

print.css

CSS ファイル内のクラスまたは ID の命名規則:

1) 先頭文字はすべて小文字にする

2) 略語は使用しないようにする例外的に英語で一目瞭然

3) あまり違いのないクラスまたは ID が見つかった場合は、メイン関数の識別文字が前にあり、場所の識別文字が後ろにある必要があります。最初の場所の識別文字は大文字にすることができます (例: navTop)。 , menuLeft)

4) 初めは英語を慎重に使用する必要があります 5 年間開発された UI フロントエンド フレームワーク!

CSS ファイル内容のコメントの記述方法:

CSS ファイル内容のコメントは統一的に使用されます:

/*

コメント内容

*/

css ファイルの格納場所:

スタイルなど、すべての CSS ファイルは統一的に格納されますルートディレクトリ コンテンツの下。