人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

CSSに関して質問です。
.menu{ と #menu{ の違いはなんでしょうか?

●質問者: kuma-ism
●カテゴリ:ウェブ制作
✍キーワード:CS
○ 状態 :終了
└ 回答数 : 15/15件

▽最新の回答へ

1 ● stnet
●13ポイント

http://www.tohoho-web.com/css/basic.htm#Class

とほほのスタイルシート入門(基礎知識)

.menuはclassの定義

#menuはid属性の定義になります

◎質問者からの返答

idはリンクも設定したclassと考えてよろしいですか?


2 ● まきのっぴ
●13ポイント

http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401j/struct/global....

The global structure of an HTML document (ja)

ID は一つの HTML 文書の中に一つしか記述できません。また、一つの要素に複数の ID を割り当てることはできません。

一方 CLASS は、一つの HTML 文書中に複数回記述することができますし、一つの要素に複数の CLASS を設定することができます。


ID は特定唯一の要素を指し示す固有名詞、CLASS は一般名詞やグループと考えて、適宜使い分ければ良いかと思います。


ID は付加的にリンクのアンカーポイントともなります。

◎質問者からの返答

リンクのアンカーポイントとはリンク元ということですか??付加的にそうなってるのですね。

初心者は使い分ける必要があまりないようですね

。。ありがとうございました。

あとは…menu a { や menu p{ はどういう意味でしょうか。何回も申し訳ございません。


3 ● まきのっぴ
●13ポイント

http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/selector.html#d...

$B%;%l%/%?(B

リンク元ではなく、リンク先です。

<h1 id=”TOP”>ページタイトル</h2>

(中略)

<a href=”#TOP”>ページタイトルへ戻る</a>

のように、ページ内リンクが実現できます。<a name=”TOP”> と同様の働きをすると考えてください。


menu a や menu p のような表記は、子孫セレクタです。

例えば .menu a は、CLASS 属性として menu を持っている要素の中にある A 要素を指します。

これは、<div class=”menu”>(中略)<a href=...> というような A 要素のにみ適用され、それ以外の A 要素には影響を与えません。

◎質問者からの返答

ありがとうございます。本を読んで頑張ったのですが、本の通り打っても、うまくいきません。

中央にも配置されず、floatの命令もきかずで

ずべて左側によってしまってます↓。


4 ● keijix
●13ポイント

http://css.uka-p.com/base_id_class.shtml

CSSの記述 -idとclassの違い

menu a { や menu p{ は


「文脈セレクタ」というもので、入れ子の関係を指定することでそのパターンに合う要素のみに適用する方法です。

menuというclassあるいはIDの範囲内にある p や a にCSSを適用するということです。

ですから、仮にdivのIDとしてmaincontenaと別のdivにmenuを設定した場合、maincontenaブロックの中にある aタグ とmenuブロックの範囲内にある aタグ にそれぞれ違ったCSSを適用できます。同じ aタグ でもそのブロックによって見えがかりを変えることができます。

http://www.hajimeteno.ne.jp/stylesheet/css1/selector.html#contex...

CSS1-セレクタ

◎質問者からの返答

ありがとうございます。


5 ● marthin
●13ポイント

.menuはclass属性 #menuはid属性になります。

何が違うか平たく言うと、

同じclass属性は、ページ内に複数有ってもかまいませんが、

同じid属性は、ページ内に1つのみ。という決めごとが有ります。

(その通りにしなくても、ブラウザが解釈してくれますが…)


また、#menu a { や #menu p { は

#menuの範囲に含まれる aやpにのみ適用させるということです。

例:<div id=”menu”><p>ああ</p></div>には適用されますが、

その他の<p>ああ</p>には適用されないということです。

◎質問者からの返答

ありがとうございます。わかりやすいです。本はなぜわかりにくいですね。。


1-5件表示/15件
4.前の5件|次5件6.
関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ