ホームページ  >  記事  >  ウェブフロントエンド  >  HTMLの命名規則

HTMLの命名規則

php中世界最好的语言
php中世界最好的语言オリジナル
2017-11-20 15:36:297586ブラウズ

HTML には厳格な命名規則があることを私たちは知っています。そのため、今日、命名の誤解を避けるためにこれらの規則を統合します。Web ページ制作で DIV+CSS 命名規則の使用を標準化すると、特に最適化効果を大幅に向上させることができます。 チームで作業する場合、共同制作の効率は明らかに向上します。

CSS+DIV Web ページ (Xhtml) を開発するとき、最も混乱して複雑になるのは CSS の名前付けです。特に初心者にとっては、何に名前を付ければよいのか、何が最適な名前付け方法なのかがわかりません。

1. 命名規則の説明: - TOP

1)、すべての名前は小文字が最適です

2)、属性の値は二重引用符 ("") で囲む必要があり、次のような値を持つ必要があります。 class= "divcss5", id="divcss5"

3)、各タグには開始と終了があり、正しいレベルが必要です。また、レイアウトは規則正しく整っていなければなりません

4)、空の要素は終了タグまたは開始タグ タグの後に「/」を追加します

5)、パフォーマンスと構造は完全に分離されており、コードにはスタイル、フォント、bgColor、border などのパフォーマンス要素は一切含まれません

6)、

から

; の定義は、大きいものから小さいものへの原則に従い、ドキュメントの構造を反映し、検索エンジンのクエリを容易にする必要があります。

7)、各テーブルとフォームに一意の構造タグ ID を追加します

8)、画像に alt タグを追加します

9)、英語の命名原則を使用するようにしてください

10)、理解できない限り、省略しないようにしてください単語の概要

DIVCSS5 では、一般的な CSS 命名方法と DIV CSS 命名方法を紹介します。

2. Web ページの外側の層の重要な部分の CSS スタイルに名前を付けます:


コートラップ ------------------最も外側に使用されます。レイヤー

header - ---------------ヘッドに使用されます

メインコンテンツmain ----------ボディコンテンツ(中央)に使用されます

main -left -------------左側レイアウト

右側メイン-right -----------右側レイアウト

ナビゲーションバーナビ-------- ----------Web メニュー ナビゲーション バー

コンテンツ ---------------Web ページの中央の本文に使用されます

下部フッター ------ --- -------- 下部に使用されます

3. DIV+CSS 命名リファレンステーブル: - TOP


以下は、CSS スタイル命名と CSS ファイル命名リファレンステーブル、DIV CSS 命名です。コレクション:

CSS スタイルの命名説明

Web ページのパブリック命名

#wrapper ページの周囲はレイアウト全体の幅を制御します

#container または #content コンテナ、最も外側に使用されます

#layout レイアウト

#head、# header ヘッダー部分

#foot , #footer フッターセクション

#nav プライマリナビゲーション

#subnav セカンダリナビゲーション

#menu メニュー

#submenu サブメニュー

#sideBar サイドバー

#sidebar_a, #sidebar_b 左または右の列

#メインページ本文

#タグタグ

#msg #メッセージプロンプト情報

#ヒントヒント

#投票投票

#フレンドリンクフレンドリーリンク

#タイトルタイトル

#概要概要

#ログインバーログインバー

#searchInput 検索入力ボックス

#hot ホットスポット

#search 検索

#search_output 検索出力と検索結果は類似しています

#searchBar 検索バー

#search_results 検索結果

#copyright 著作権情報

#ブランディング 商標

#logo ウェブサイトのロゴ

#siteinfo ウェブサイト情報

#siteinfoLegal 法的声明

#siteinfoクレジット 評判

#joinus 参加してください

#partner パートナー

#service サービス

#regsiter 登録

到着/ arrow arrow

#ギルドガイド

#サイトマップウェブサイトマップ

#リストリスト

#ホームページホームページ

#サブページセカンダリページサブページ

#ツール, #ツールバーツールバー

#ドロップドロップダウン

# dorpmenu ドロップダウン メニュー

#ステータス status

#スクロール スクロール

.tab tab

.left .right .center left、center、right

.news

.download

.ban ner 広告バナー(上部の広告バナー)

電子貿易関連

.products 製品

.products_prices 製品価格

.products_description 製品説明

.products_review 製品レビュー

.editor_review 編集者のレビュー

.news_release 最新製品

出版社プロデューサー

.スクリーンショット サムネイル

.faq FAQ

.keyword キーワード

.blog blog

.forum フォーラム

CSS ファイル名の説明

master.css、style.css メイン

モジュール。 css モジュール

base.css は基本的に

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

主題.css テーマ

columns.css 列

font.css テキスト、フォント

forms.css フォーム

mend.css patch

を共有します。

print.css print

CSS 命名に関するその他の手順:

DIV+CSS の名前付けの概要: 記号で始まる名前を選択するのに「.」(小文字のピリオド) を使用するか、記号で始まる名前を選択するのに「#」(ポンド記号) を使用するかは関係ありません。メインの重要なボックスは「#」 (ポンド記号) の選択記号で始まる名前が付けられており、その他のボックスは「.」 (小文字のピリオド) の選択記号で始まる名前が付いていることも考慮してください。 HTML 転送で再利用できるように CSS セレクター に名前を付けます。

通常、最も一般的に使用されるメイン名は次のとおりです: ラップ (コート、最外層)、ヘッダー (ヘッダー、ヘッダー)、nav (ナビゲーション バー)、メニュー (メニュー)、タイトル (列タイトル、通常は h1h2h3h4 タグで使用されます)

、コンテンツ (コンテンツ領域)、フッター (フッター、下部)、ロゴ (ロゴ、h1 タグと併用可能)、バナー (広告バナー、通常は上部)、copyRight (著作権)。その他は必要に応じて選択して使用できます。

DIVCSS5 の推奨事項: メイン、重要、および最も外側のボックスには「#」 (シャープ記号) 選択記号で始まる名前を付け、その他のボックスは「.」 (小文字のピリオド) 選択記号で始まる名前を付ける必要があります。

2. CSS スタイル ファイルの名前は次のとおりです。


main master.css

layout、layout.css

columns.css

text font.css

print style print.css

theme テーマ.css

4. 英語の命名スキル:


一般的に使用されていないものに遭遇した場合は、翻訳ツールを使用して英語に翻訳し、名前を付けることができます。

Google オンライン翻訳ツールを使用することをお勧めします: http://translate.google.cn/


標準化された CSS の名前付けには多くのメリットがありますので、便利な名前付けルールを皆さんに遵守していただきたいと思います。あなたと私。

関連書籍:

HTML が div を管理および美化するために CSS を呼び出す方法

css+div の典型的なレイアウトの基本フレームワーク

ラジオ局リストの DIV+CSS 実装を示す例

以上がHTMLの命名規則の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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