ＨＰ制作　スタイルシートに関してwin

Question

rrr3

212

199もっと見る

80pt

コンピュータウェブ制作

ＨＰ制作　スタイルシートに関してwin

<table>
<tr>
<td>
テーブル
<table>
<tr><td>1</td><td>いち</td></tr>
<tr><td>2</td><td>に</td></tr>
</table>
</td>
</tr>
<tr>
<td>
上はテーブルです
</td>
</tr>
</table>

「質問です」
上記はテーブルの入れ子です。
ここに出てくる文字（テーブル、１、２、いち、に、上はテーブルです）を全て
font 11px
カラー red
にするにはどういうクラスにすればいいですか？

divで挟む下記はだめなんでしょうか？だめならどうしてですか？
－－－－－－－－－－－－－－－－－－－－－－－－
.setei:{
font-size11;
font-color red;
}

<div class="setei">
<table>
<tr>
<td>
テーブル
<table>
<tr><td>1</td><td>いち</td></tr>
<tr><td>2</td><td>に</td></tr>
</table>
</td>
</tr>
<tr>
<td>
上はテーブルです
</td>
</tr>
</table>
</div>
－－－－－－－－－－－－－－－－－－－－－－－－

回答の条件

URL必須
1人2回まで

登録：2007/05/30 22:07:50
終了：2007/06/06 22:10:03

※ 有料アンケート・ポイント付き質問機能は2023年2月28日に終了しました。

	回答者	回答	受取	ベストアンサー	回答時間
1	naleringar	110回	105回	5回	2007-05-30 22:40:36
1	naleringar
2	Q-A	106回	99回	16回	2007-05-30 23:34:48
2	Q-A

コメントはまだありません

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

リクエスト送信済

回答リクエストを送信したユーザーはいません

じゃっくそにっく · Answer 1 · 2007-05-30T22:44:18+09:00

こんにちは。

tdに対して設定する必要があります。

div で囲む場合は、

tdはdivの中に入っているので、包含関係を考慮して、

.divのクラス名 td { }

という風に、記述する必要があります。

(半角空白を間にあけます)

tdすべてに設定するケース

<html>
<head>
<style>
td{
	font-size :11px;
	color:red;
}
</style>
</head>
<body>
<table>
<tr>
<td>
テーブル
<table>
<tr><td>1</td><td>いち</td></tr>
<tr><td>2</td><td>に</td></tr>
</table>
</td>
</tr>
<tr>
<td>
上はテーブルです
</td>
</tr>
</table>
</body></html>

seiteiクラスのdiv の中に含まれる td に設定するケース

<html><head>
<style>
.setei td{
	font-size :11px;
	color:red;
}
</style>
</head>
<body>
<table>
<tr>
<td>
テーブル
<table>
<tr><td>1</td><td>いち</td></tr>
<tr><td>2</td><td>に</td></tr>
</table>
</td>
</tr>
<tr>
<td>
上はテーブルです
</td>
</tr>
</table>
</body></html>

http://www.seo-equation.com/html/css/box

tezcello · Answer 2 · 2007-05-30T23:43:31+09:00

前半の回答は、

<style>
<!--
table {
  font-size: 11px;
  color: red;
}
-->
</style>

を head タグ内に記述すればよいでしょう。

後半の回答はDOCTYPE宣言が正しくなされていない為、旧来の（CSS的に正しくない）表示になってしまうのでしょう。

試しに、HTMLファイルの先頭に

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">

を入れてやると正常に表示されると思います。

尚、質問文中の記述は誤りの様ですね。

div タグでくくるのならこんな感じです。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"><html>
<head>
<title></title>
<style>
<!--
.setei {
  font-size: 11px;
  color: red;
}
-->
</style>
</head>
<body>
<div class="setei">
<table border="1">
<tr>
  <td>テーブル<br>
    <table border="3">
      <tr><td>1</td><td>いち</td></tr>
      <tr><td>2</td><td>に</td></tr>
    </table>
  </td>
</tr>
<tr>
  <td>上はテーブルです</td>
</tr>
</table>
</div>
</body>
</html>

参考

http://www.seo-equation.com/www/cat25/doctype_switching

http://www.mozilla.gr.jp/standards/webtips0014.html

じゃっくそにっく · Answer 3 · 2007-05-31T15:30:31+09:00

seteiクラスのdiv の中に含まれる

こちらはどのように設定すればいいですか？

全てのtdに

＜td class="setei"＞と記述必要でしょうか？

いえ、

<div class="setei"> ～ </div>

の範囲の中に含んでいれば、

ブラウザが自動で包含関係を判断し、

seteiのDIVの中に入っているtdにだけスタイルを適用

してくれます。

 .setei table td { font-size:11px; color:red; }

=seteiというクラス名がついたタグの中にある、

table の中にある、td タグに対してスタイルを適用する。

例

<html><head>
<style>
.setei table td{
	font-size :11px;
	color:red;
}
</style>
</head>
<body>

<div class="setei">
<table>
<tr>
<td>
setei(div)内に含まれるテーブル
<table>
<tr><td>1</td><td>いち</td></tr>
<tr><td>2</td><td>に</td></tr>
</table>
</td>
</tr>
<tr>
<td>
上はテーブルです
</td>
</tr>
</table>
</div>

<table>
<tr>
<td>
setei(div)内に含まれないテーブル
<table>
<tr><td>1</td><td>いち</td></tr>
<tr><td>2</td><td>に</td></tr>
</table>
</td>
</tr>
<tr>
<td>
上はテーブルです
</td>
</tr>
</table>

</body></html>

適用した表示サンプル

http://f29.aaa.livedoor.jp/~morg/wiki/sample/tablex.html

ＨＰ制作　スタイルシートに関してwin

回答（5件）

じゃっくそにっく124252007/05/30 22:44:18

tezcello460692007/05/30 23:43:31

じゃっくそにっく124252007/05/31 15:30:31

質問者が未読の回答一覧

コメント（0件)

この質問への反応（ブックマークコメント）

ＨＰ制作 スタイルシートに関してwin

回答（5件）

じゃっくそにっく124252007/05/30 22:44:18

tezcello460692007/05/30 23:43:31

じゃっくそにっく124252007/05/31 15:30:31

質問者が未読の回答一覧

コメント（0件)

この質問への反応（ブックマークコメント）

ＨＰ制作　スタイルシートに関してwin