ホームページ  >  記事  >  ウェブフロントエンド  >  Web ページ切り取り時の div+css の命名規則 process_html/css_WEB-ITnose

Web ページ切り取り時の div+css の命名規則 process_html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-24 12:32:321471ブラウズ

Web ページカットプロセス中の Div+CSS 命名規則
コンテンツ: コンテンツ/コンテナ ナビゲーション: ナビゲーション サイドバー: サイドバー
コラム: コラム ロゴ: ロゴ ページ本体: メイン
広告: バナー ホットスポット: ホットニュース: ニュース
ダウンロード: ダウンロードサブナビゲーション: subnav メニュー: menu
検索: 検索フッター: footer スクロール: スクロール
著作権: copyright フレンドリーリンク: friendslink サブメニュー: submenu
コンテンツ: content タグページ: tab 記事リスト: list
登録: regsiter プロンプト情報: メッセージヒント: ヒント
参加: joinus 列タイトル: タイトル ガイド: ギルド
サービス: サービス ステータス: ステータス 投票: 投票
末尾: フッター パートナー: パートナー ログイン バー: ログインバー
ページ周辺制御全体のレイアウト幅: ラッパー左右中央: 左右center

(2) コメント書き込み:
/* Footer */
コンテンツエリア
/* End Footer */

(3) IDネーミング:

(1) ページ構造
コンテナ: コンテナ ページヘッダ : header コンテンツ:コンテンツ/コンテナ
ページボディ:メイン ページフッター:フッター ナビゲーション:nav
サイドバー:サイドバー カラム:column 左右中央:左右中央
ページ周辺コントロール全体のレイアウト幅:ラッパー
(2)ナビゲーション
ナビゲーション:nav
メインナビゲーション: mainbav
サブナビゲーション: subnav
トップナビゲーション: topnav
サイドナビゲーション: サイドバー
左ナビゲーション: leftsidebar
右ナビゲーション: rightsidebar
メニュー: メニュー サブメニュー: サブメニュー タイトル: タイトル 概要: 概要

(3) 特徴
ロゴ: ロゴ
広告:バナー
ログイン:ログイン
ログインバー:ログインバー
登録:登録者
検索:検索
リボン:ショップ
タイトル:タイトル
参加:ジョイナス
ステータス:ステータス
ボタン:btn
スクロール:スクロール
タブページ:タブ
記事リスト: リスト
プロンプトメッセージ: メッセージ
現在: 現在
ヒント: ヒント
アイコン: アイコン
メモ: メモ
ガイド: ギルド
サービス: サービス
ホットスポット: ホット
ニュース: ニュース
ダウンロード: ダウンロード
投票:投票
パートナー: パートナー
フレンドリー リンク: リンク
著作権: copyright

(4) クラスの名前:
(1) 色:
red { color: red } などの 16 進コードの名前を使用します。 .f60 { color: #f60; }
.ff8600 { color: #ff8600; }
(2) フォント サイズ。
.font12px { font -size: 12px; など、名前として直接使用します。 }
.font9pt {font-size: 9pt; }
(3) 配置スタイル。
.left { float:left; }
( 4) タイトル バーのスタイルは、「カテゴリ + 関数」メソッドを使用して名前を付けます (例:
.barnews { }
.barproduct { })。
1. 必ず小文字を使用してください。
3.ダッシュや下線を追加しないでください。
4. 一目で理解できる単語でない限り、単語を省略しないようにしてください。
メインの master.css モジュール module.css は、基本的に、base.css
主題.css 列を共有します。 print print.css
Text font.css form Forms.css patch mend.css
layout、レイアウトlayout.css



声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。