ホームページ > ウェブフロントエンド > CSSチュートリアル > CSS開発でよく使われる名前付け

CSS開発でよく使われる名前付け

Guanhui
リリース: 2020-05-22 11:05:39
転載
2143 人が閲覧しました

CSS開発でよく使われる名前付け

#CSS 命名仕様 (ルール) よく使用される CSS 命名規則


# ヘッダー: header

コンテンツ: content/container

テール: footer

ナビゲーション: nav

サイドバー:sidebar

列: column

ページ周辺機器コントロール全体のレイアウト幅: ラッパー

左右中央: 左右中央

ログインバー:loginbar

ロゴ: logo

広告: バナー

ページ本体: main

ホットスポット: hot

ニュース: ニュース

ダウンロード: download

サブナビゲーション: subnav

メニュー: menu

サブメニュー: submenu

検索: search

フレンドリー リンク: friendslink

フッター: footer

著作権: copyright

スクロール:スクロール

コンテンツ: content

タグ: tags

記事リスト: list

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

ヒント: ヒント

列タイトル: title

参加: joinus

ガイド: guide

サービス: service

登録: regsiter

ステータス: status

投票: vote

パートナー: パートナー

コメント:

/* ヘッダー */

コンテンツ領域

/* 終了ヘッダー */

ID 命名:

1. ページ構造

コンテナー: コンテナー

ページ ヘッダー: header

コンテンツ: content/container

ページ本文: main

フッター: footer

ナビゲーション: nav

サイドバー:sidebar

列: 列

ページ周辺コントロール全体のレイアウト幅: ラッパー

左右中央: 左右中央

2、ナビゲーション

ナビゲーション: nav

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

サブ ナビゲーション: subnav

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

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

左側のナビゲーション: leftsidebar

右ナビゲーション: rightsidebar

メニュー: menu

サブメニュー: submenu

タイトル: title

概要: summary

3. 機能

ロゴ: logo

広告: バナー

ログイン: login

ログインバー:loginbar

登録: register

検索: search

リボン: shop

タイトル: title

参加: joinus

ステータス: status

ボタン: btn

スクロール:scroll

タブ: tab

記事リスト: list

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

現在: current

ヒント: Tips

アイコン: icon

注: note

ガイド: ギルド

サービス: service

ホットスポット: ホット

ニュース: ニュース

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

投票: 投票

協力パートナー: パートナー

フレンドリーリンク: link

著作権: copyright

注::

1. すべて小文字;

2 . できるだけ英語を使用してください;

3.ダッシュや下線を追加しないでください;

4.一目で理解できる単語でない限り、単語を省略しないようにしてください。

CSS スタイル シート ファイルの名前

メイン master.css

モジュール module.css

基本共有 Base.css

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

テーマ主題s.css

列 columns.css

テキスト font.css

フォーム Forms.css

mend.css にパッチを適用します。

Print print.css

推奨チュートリアル: 「

CSS チュートリアル

以上がCSS開発でよく使われる名前付けの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
css
ソース:zhihu.com
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート