表の文字の色やサイズの一括設定がうまくいきません

質問

一列の表を作って、それぞれのセルをボタンに見立てて、リンクをはろうとしています。

それぞれのセルにフォントのサイズ、種類、色を指定するとうまくいくのですが、一括設定しようとするといまくいきません。

<style type=text/css>
td {font-size:20px;font-face="HGSゴシック体"; color:#000000;}
</style>

これで、サイズだけは変わるのですが、フォントの種類と色がかわりません。いろいろ調べたのですが、いろいろな設定を一括してする例がのっているサイトがあまり見つからず、どこが間違っているのかわからずにいます。

また、下記のようにリンクをはった場合、
<tr><td><a href="index.html">Top</a></td></tr>

同じような設定の仕方で、文字の色やサイズを変えることができますか。

よろしくお願い致します。

回答No.1

aoumiushi · ベストアンサー

CSSでのフォントの種類はfont-familyを使います。
sans-serifは指定したフォントが無い場合、ゴシック系フォントを使用します。
色が変わらないのは、font-faceでエラーになっているから、その後のcolorが無効になるため。

<a>要素の色などを変えたい場合そのままだと、ページ内の<a>の全てが変わってしまうので
以下のようにすると<td>内の<a>のみ変更できる。

<style type=text/css>
td {
font-size: 20px;
font-family: "HGSゴシックE",sans-serif;
color: #000000;
}

td a {
color: #0000ff;
}
td a:hover {
color: #ff0000;
}
</style>

お礼

丁寧な語説明ありがとうございました。うまくいきました。CSSでのフォントの種類はfont-familyで指定するのですね。初歩的なことがわかってなくて、お恥ずかしいかぎりです。フォントのところでエラーがでたために、色が変わらなかった点、了解しました。

<td>内の<a>のみ変更するやり方もお教えいただき、感謝感謝です。ありがとうございました。

回答No.2

aoumiushi

No1です
フォント名の部分で、"HGSゴシックE"とダブルクォーテーションを使っていますが、
フォント名の(ＭＳ 明朝)のように名称の間にスペースがある場合に使います。

よってこの場合は
font-family: HGSゴシックE,sans-serif;
でもOKです。

お礼

ご説明いただいた点も、質問には入れなかったのですが、わからずにいましたので、助かりました。スペースが入っていない場合は、ダブルクォーテーションで囲わなくてよいのですね。ご丁寧にありがとうございました。