テーブルの作り方
-
0 名前： 凛 ： 2006/02/28 01:51
- 現在、素人ながらＣＳＳで表を作成しています。
まだ、しっかりとした質問さえ出来ませんが、
下記の質問にお答え下さい。お願いします。
①スタイルシートでデータの横幅や縦幅などを設定できますか？
出来るとしたら、どのようにしたらいいでしょうか？
②また、表全体をFloat-right内で中央に持ってくるにはどうしたら
いいでしょうか？
③見出しセルを下記の通りに設定しましたが、
その色が反映されません・・なにか間違っているところがあるのでしょうか？
/* 表作成 */
table.sample1{
font-size : 10pt;
line-height : 5mm;
color : #3e3e3e;
border-width: 1px;
border-color: silver;
border-style: solid;
border-collapse: collapse;
margin-left:20px;
align:center;
}
table sample1 th {
border-width: 1px;
border-color: black gray;
border-style: solid dotted;
padding: 3px;
background-color: #c2d5fc;
}
table sample1td {
border: 1px gray dotted;
padding: 3px;
}
-
1 名前： 通りすがり ： 2006/02/28 01:51
- >table sample1 th
これってtableを親要素に持つsample1を親要素に持つthってことになりませんか？
table.sample1 thこうじゃないですか？
-
2 名前： カヅサツ ： 2006/02/28 01:51 ［URL］
- > ①スタイルシートでデータの横幅や縦幅などを設定できますか？
データって何ですか？
> ②また、表全体をFloat-right内で中央に持ってくるにはどうしたらいいでしょうか？
表の親要素に float: right が指定されているのですか？
-
3 名前： 凛 ： 2006/02/28 01:51
- あまり、詳細を伝えられなくて申し訳ないです・・。
データーというのは、セルの幅のことです。
セルの幅や高さなどの表したつもりです。
また、親要素・・DIV で段組したので、
表の親要素に float: right が指定されているとおもいます。
すみません・・・お手数ばかりをお掛けして・・。
どうぞよろしくお願いします。
-
4 名前： カヅサツ ： 2006/02/28 01:51 ［URL］
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja" dir="ltr">
<head>
<title></title>
<style type="text/css">
#test1{
background-color: #FFC;
float: right;
width: 80%; /* floatを指定したらwidthは必須 */
height: 500px;
}
#test2{
background-color: #FCF;
float: right;
width: 20%; /* floatを指定したらwidthは必須 */
height: 500px;
}
table,th,td{
border-width: 1px;
border-style: solid;
border-color: #000;
}
table{
border-collapse: collapse;
}
th{ /* セルに横幅や縦幅などを設定した例 */
width: 30%;
height: 4em;
}
#test1 table{
width: 50%;
margin: 0px auto; /* 左右margin を auto にすると、要素がセンタリング */
}
#test1 p{
background-color: #CCF;
margin: 1em 0px 1em auto; /* 右margin を 0、左margin を auto にすると、要素が右寄せ */
padding: 3px;
width: 50%;
}
</style>
</head>
<body>
<div id="test1">
<p>test1</p>
<table>
<tbody>
<tr>
<th>見出しセル</th><td>通常セル</td>
</tr>
</tbody>
</table>
</div>
<div id="test2">
<p>test2</p>
</div>
</body>
</html>
-
5 名前： 凛 ： 2006/02/28 01:51
- たすかりました。
ガツサツさん、本当にありがとうございます。
すごく親切に教えて頂き、感謝です。
