リンキングCSSについて

質問

どうしても判らないので初心者的なのですが質問させていただきます。
タイトルにもありますように、リンキングCSSについてです。
読み込む元のcssファイルの記述なんですが、どの本、どのサイトを回っても
Ｈ１{ｃｏｌｏｒ：＃○○○○○○}
Ｈ２{ｃｏｌｏｒ：＃▲▲▲▲▲▲}等記述してあります。
頭の部分をＨ１にして読み込むと見出しになってしまうので嫌なのです。
また＜ｐ＞にした場合ですと、複数記述が出来ません。
ためしに
a{ｃｏｌｏｒ：＃○○○○○○}
b{ｃｏｌｏｒ：＃▲▲▲▲▲▲}と記述してみましたところ、
これは綺麗に表示されました。

この表示の仕方でも大丈夫なのでしょうか？

「わからないならHEADに記述かインラインにすれば？」と思われる方も
いらっしゃりますでしょうが、どうしてもリンキングにしたいのです。

とても困っています。
どなたか宜しくお願いいたします。

回答No.6

noname#30871

>ですが、全てインラインCSSの場合の記述でしたので・・・

　えーと、その、ですからNo.4で言いましたように、「スタイルシートの指定方法」と「個々のスタイルの記述方法」は関係ないんですよ。外部スタイルシートにこだわっておられますが、インラインCSSと同じ記述でよいのです。

>色々とためしてみたのですが、さっぱり・・・です。

　どのように試されたのか具体的に書いていただければ助かります。そもそも外部スタイルシートそのものがまったく有効にできない状態なのでしょうか？　それとも、リンクの色の制御だけができない状態なのでしょうか？　HTMLファイルとCSSファイルはそれぞれどのような記述をされたでしょうか？

　CSSファイルの例を示すと、次のような記述になります。

↓ここから↓
a:link { color: #006600; text-decoration: none}
a:visited { color: #00CC00; text-decoration: none}
↑ここまで↑

補足

ありがとうございました。
どうやら、私勘違いをしていたようです。

インラインCSSと同じで良かったんですね。

>色々とためしてみたのですが、さっぱり・・・ですとは、
他に指定したものは大丈夫だったのですが、リンクの色の制御だけが効かない状態でした。
p.font_link{alink-color:#ffffff;text-decoration:none;}
と記述していたためです。

ありがとうございました。
無事解決することができました。

回答No.5

noname#30871

> <SPAN>はインライン要素～ということはインラインCSSでのみ使用できる・・という事でしょうか・・・？
> <DIV>はブロック要素～　というのは・・・？

　No.2で示した参考URLをご覧になっていれば、おわかりだと思います。
　HTML要素は、インライン要素とブロック要素の二種類に分類されます。CSSの適用範囲が一つの文章構造（例：段落）であればブロック要素すなわち<DIV>、そうでなければインライン要素すなわち<SPAN>を使うということです。
　「インライン要素」で言うインラインは、CSSのインライン指定とは関係ありません。

>同じくリンキングCSSでリンクの色を未訪問、訪問済み等の変更

　これは、CSSを扱っている書籍やサイトであれば載っているはずです。たとえば：
http://homepage1.nifty.com/WEB_RENYA/master/csssample_01.html

補足

お教えありがとうございました。m(_ _)m

>リンキングCSSでリンクの色を未訪問、訪問済み等の変更
>これは、CSSを扱っている書籍やサイトであれば載っているはずです。たとえば
>http://homepage1.nifty.com/WEB_RENYA/master/csssample_01.html

私の持っている書籍にも、ぐるぐる回ったサイトさんにも確かにありました。
ですが、全てインラインCSSの場合の記述でしたので・・・
お教え頂きましたサイトさんにも載っておりましたが・・・

多分、これを応用すれば実行できるのでしょうが、どこをどう応用して
いいものやら、現在の私には判りかねております。
色々とためしてみたのですが、さっぱり・・・です。

何度も申し訳ありませんが、お教え願えたら・・・と思います。
宜しくお願いします。

回答No.4

noname#30871

ちょっと話を整理してみましょう。

(a) スタイルシートの指定方法（<STYLE>に書く方法、外部スタイルシートに書く方法）
(b) 個々のスタイル（H1{…}など）の記述方法

　こうして分けてみますと、(a)と(b)は独立した話なのです。(a)をどう選ぼうが、(b)には影響しないのです。(a)にこだわっておられますが、お尋ねになりたいのは(b)のほうだと思います。

　そして(b)の前提として次の原則があります。

(i) CSSスタイルの適用範囲を指定する単位はHTML要素である。HTML要素とは簡単に言えば、開始タグから終了タグまでのこと。
(ii)ほとんどのHTML要素には、固有の意味がある。たとえば<H1>は大見出し、<P>は段落、<A>はアンカー（リンク）、<B>は強調表示、etc。

　だから

「この範囲にCSSを適用して色を変えたい」→「<H1>を使ってみる」→「見出しになってしまった」

という作成手順は誤りです。なぜなら、<H1>はもともと見出しという固有の意味を持った要素だからです。

「この範囲にCSSを適用して色を変えたい」→「でも、この範囲には固有の意味は特にない」

という時に使うのが<DIV>要素や<SPAN>要素です。これらは、スタイルの適用範囲を示すだけであって固有の意味はありません。ただし<DIV>はブロック要素、<SPAN>はインライン要素になります。

補足

解答ありがとうございます。
<SPAN>はインライン要素～ということはインラインCSSでのみ使用できる・・という事でしょうか・・・？

<DIV>はブロック要素～　というのは・・・？

ごめんなさい。私、初心者も良い所ですね（恥）

よろしければお教え願えますでしょうか・・・m(_ _)m

回答No.3

noname#21343

こんにちは。先のお二方への補足を読んで、ご質問の意味が分かったような気がしましたので、ご説明します。

　<h1> とか <h2> の <h> は、header (ヘッダー）、つまり「見出し」を意味しています。数字が大きいほど、表示される文字のサイズも大きくなってしまいます。

　普通の文章部分にスタイルシートを使用したいときは、<p> タグを使います。paragraph （パラグラフ）、つまり「段落」の事です。

　で、「複数記述」、ってのは、例えば同じ <p> タグでも、場所によって文字の色を変えたい、ってことですよね？この場合は、<class> を指定すればＯＫです。

　例えば、最初の段落は #cc0000 で、次の段落は #00cc00 にしたいときは、css の記述を

p.danraku_1{color:#cc0000;}
p.danraku_2{color:#00cc00;}　――としておいて、

　html ファイルのほうでは、

<p class="danraku_1">この部分の文字色は #cc0000</p>
<p class="danraku_2">この部分の文字色は #00cc00</p>

　――としてあげる、ってことです。

　もちろん、<h> タグでもＯＫです。例えば見出し部分に <h2> タグを使って、それぞれの見出しの色を変えたい時には

h2.midashi_1{color:#cc0000;}
h2.midashi_2{color:#00cc00;}　――として、

<h2 class="midashi_1">この見出しの色は #cc0000</h2>
<h2 class="midashi_2">この見出しの色は #00cc00</h2>

　――って感じですね。

　多分これでうまくいくと思うんですが。もしダメだったら、補足してください。分かる範囲で、お力になれればと思います。

　長くなってしまいましたが、参考になれば幸いです。

補足

ありがとうございました。解決しました～m(_ _)m

もうひとつ質問があるんですが、良いでしょうか？
同じくリンキングCSSでリンクの色を未訪問、訪問済み等の変更がしたいのですが、
方法がわかりません・・・

よろしければ、解答お願い致します。m(_ _)m

回答No.2

noname#30871

すみません、ご質問の意味がちょっとわかりません。（「頭の部分」？　「複数記述」？）

　CSSスタイルは、外部スタイルシートに書こうが<STYLE>要素に書こうが、表現で
きるスタイルは同じだったはずです。

　もう少し補足していただければ助言できるかもしれません。

　ちなみに、ご存知だとは思いますがインライン要素の意味は、参考URLで説明されています。

参考URL：

http://www.ne.jp/asahi/minazuki/bakera/html/reference/inline

補足

質問が分からなくなってしまいすみませんでした。
cssは最近HPに使おうとしていて、初心者なのです。

>CSSスタイルは、外部スタイルシートに書こうが<STYLE>要素に書こうが、
>表現できるスタイルは同じだったはずです。

その通りなのですが、HEADに記述・インラインCSSにする場合には
表示するHTMLファイルに直接書き、また変更する場合も
一つ一つ直していかなければならないんですよね？

リンキングCSSの場合でしたら、外部cssファイルに記述し、
それを表示するHTMLに書けば、複数のHTMLファイルの変更が可能なんですよね？

私がやりたいのは、例えば外部cssファイルに
Ｈ１{ｃｏｌｏｒ：＃○○○○○○}
Ｈ２{ｃｏｌｏｒ：＃▲▲▲▲▲▲}
と記述し、表示されるHTMLの部分に
<Ｈ１>123（色はcssファイルで指定した○○○○○○）<／Ｈ１>
<Ｈ２>123（色はcssファイルで指定した▲▲▲▲▲▲）<／Ｈ２>
というように表示させたいんです。

でも、Ｈ１{ｃｏｌｏｒ：＃○○○○○○} という風に
頭の部分（すみません呼び名がわかりません）をH1として
HTMLファイルで呼び出すとH1タグで文字サイズが大きくなってしまいます。

試しに、頭の部分のＨ１というのを変えてcssファイルに
a{ｃｏｌｏｒ：＃○○○○○○}
b{ｃｏｌｏｒ：＃▲▲▲▲▲▲}
HTMLファイルに
<a>123（色はcssファイルで指定した○○○○○○）<／a>
<b>123（色はcssファイルで指定した▲▲▲▲▲▲）<／b>
と記述してみた所、きちんと表示されました。

でも参考書やサイトを回ってもそのような記述をしている人は
いなかったので、これはやっぱり間違っているのでしょうか・・・？

本当に本当に初心者なので、質問ばかりしてしまって申し訳ありません。
宜しければ教えていただけますでしょうか・・・。

回答No.1

toysmith

H1タグやPタグが嫌って事は「インライン要素に対してスタイルを付加したい」ってことですか？
SPANタグならインラインにブロック要素を埋め込むことが出来ると思いますが。

質問の意図が理解できていないかも？

補足

質問が分からなくなってしまいすみませんでした。
cssは最近HPに使おうとしていて、初心者なのです。
読み込む元のcssファイルに
Ｈ１{ｃｏｌｏｒ：＃○○○○○○}
Ｈ２{ｃｏｌｏｒ：＃▲▲▲▲▲▲}
と記述し、表示されるHTMLの部分に
<Ｈ１>123（色はcssファイルで指定した○○○○○○）<／Ｈ１>
<Ｈ２>123（色はcssファイルで指定した▲▲▲▲▲▲）<／Ｈ２>
と書くと、文字が大きくなってしまいます。

文字を大きくせずにリンキングCSSで表示させるには
どうしたら良いでしょうか。

本当に本当に初心者なので、宜しければ教えていただけますでしょうか・・・。

お願いいたします。