複数のtableをＣＳＳで修飾する方法



パソコントラブル解決・過去ログTOP  >  ログTOP

◇-?複数のtableをＣＳＳで修飾する方法-しん-08/09-14:07(153)-No.364138
　┗?!Re:複数のtableをＣＳＳで修飾す...-テツヤ-08/09-14:44(152)-No.364143
　　┗?!【解決】Re:複数のtableをＣＳＳ...-しん-08/09-16:02(151)-No.364156
　　　┗?!K?Re:複数のtableをＣＳＳで修飾...-しん-08/10-12:00(131)-No.364308
　　　　┗?!K?!Re:複数のtableをＣＳＳで修�...-テツヤ-08/10-15:37(127)-No.364357
　　　　　┗?!K?!?Re:複数のtableをＣＳＳで修...-しん-08/10-23:07(120)-No.364427
　　　　　　┗?!K?!?!Re:複数のtableをＣＳＳで�...-テツヤ-08/11-10:10(109)-No.364482
　　　　　　　┗?!K?!?!【解決】Re:複数のtableを�...-しん-08/11-10:47(108)-No.364489
▲このページのトップに戻る
364138複数のtableをＣＳＳで修飾する方法しん 2006/08/09-14:07

メーカー名：東芝
ＯＳ名：WindowsXp HomeEdition
パソコン名：ＰＡＥＸ５２２ＰＤＥ３
ソフト関連：ソフトの使い方がわからない
使用回線：ADSL
--
tableレイアウトをＣＳＳを勉強しながら修正しています。
その過程で、下記に事が不明です。

tableが２つ有りますが、
下のtableのみbackgroundに#fafad2を付けたい。

何方かお願いいたします。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<title>お祭り</title>
<style type="text/css">
<!--
table {border-collapse:collapse;margin:5px 50px 5px 100px;}
table,th,td {border:solid #6699ff 2px;}
th,td {padding:1em;}
-->
</style>
</head>
<body>
<table>
<tr><th>会　場</th><th>中央公園</th><th>開催日</th><th>１８年８月２６日（土）</th></tr>
</table>
<table>
<tr><th>焼 き 鳥</th><th>こんにゃく</th><th>焼きそば</th></tr>
<tr><th>か き 氷</th><th>枝豆</th><th>カレーライス</th></tr>
<tr><th>ビール</th><th>光るブレスレット</th><th>綿 ア メ</th></tr>
</table>
</body>
</html>

▲このページのトップに戻る
364143Re:複数のtableをＣＳＳで修飾する方法テツヤ 2006/08/09-14:44

記事番号364138へのコメント
　HEAD要素内のスタイルシートで指定しなければならないのでしょうか？
　下のTABLE要素に背景色を直接付ける《
<table style="background-color:#fafad2">
<tr><th>焼 き 鳥</th><th>こんにゃく</th><th>焼きそば</th></tr>
<tr><th>か き 氷</th><th>枝豆</th><th>カレーライス</th></tr>
<tr><th>ビール</th><th>光るブレスレット</th><th>綿 ア メ</th></tr>
</table>
》又は、HEAD要素内のスタイルシートで指定《
<style type="text/css">
<!--
.test {background-color:#fafad2}
table {border-collapse:collapse;margin:5px 50px 5px 100px;}
table,th,td {border:solid #6699ff 2px;}
th,td {padding:1em;}
-->
</style>

…途中省く…

<table class=test>
<tr><th>焼 き 鳥</th><th>こんにゃく</th><th>焼きそば</th></tr>
<tr><th>か き 氷</th><th>枝豆</th><th>カレーライス</th></tr>
<tr><th>ビール</th><th>光るブレスレット</th><th>綿 ア メ</th></tr>
</table>
》のどちらかでしょう。

http://pasokoma.jp/bbs.shtm?num=363683&ope=sel
の方は解決しましたか？。

▲このページのトップに戻る
364156Re:複数のtableをＣＳＳで修飾する方法しん 2006/08/09-16:02

記事番号364143へのコメント
テツヤさんは No.364143「Re:複数のtableをＣＳＳで修飾する方法」で書きました。


テツヤさんまたまたありがとうございました。

head内に記載する方法を取りました。




http://pasokoma.jp/bbs.shtm?num=363683&ope=sel

之はもう少し時間を下さい。

学ぶ事が多くて、進化に付いて行くのが大変で、消化不良気味です。

tableレイアウトよりＣＳＳはやりにくい

ガンバリマス。

▲このページのトップに戻る
364308Re:複数のtableをＣＳＳで修飾する方法しん 2006/08/10-12:00

記事番号364156へのコメント
しんさんは No.364156「Re:複数のtableをＣＳＳで修飾する方法」で書きました。

テツヤさんありがとうございました。



之で一応解決と思いましたが、次の疑問もお願いできないでしょうか。

今までの
<table align="center"> </table>

はＣＳＳではどう記載するのですか。

更に前回のように、Ｔａｂｌｅは複数有りますし、

更に左より、中央、右といくつもあります。

さらに こんなのも
<td colspan="5" rowspan="3" valign="top">　※　販売時間<br>

多く有ります

head内に記載する方法を取ります。


▲このページのトップに戻る
364357Re:複数のtableをＣＳＳで修飾する方法テツヤ 2006/08/10-15:37

記事番号364308へのコメント
しんさんは No.364308「Re:複数のtableをＣＳＳで修飾する方法」で書きました。
> <table align="center"> </table>
> <td colspan="5" rowspan="3" valign="top">　※　販売時間<br>
　…は、《
<HEAD>
<STYLE>
.test {text-align:center}
.test2 {vertical-align:top}
</STYLE>
</HEAD>
<BODY>
<TABLE class=test>
<td class=test2 colspan="5" rowspan="3">　※　販売時間<br>
</TABLE>
</BODY>
》これでどうかな？。
　一応仕様書張っときます。直ぐには理解出来ないかも知れませんが…いつかは解るようになるでしょ…。
　わからない所はまた質問して…。
http://www.swlab.it.okayama-u.ac.jp/man/rec-css1/rec-css1.html
http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/cover.html


▲このページのトップに戻る
364427Re:複数のtableをＣＳＳで修飾する方法しん 2006/08/10-23:07

記事番号364357へのコメント
テツヤさんは No.364357「Re:複数のtableをＣＳＳで修飾する方法」で書きました。

テッヤさんありがとうございます。

テキストの行揃えは何とか理解出来たのですが。

ＴＡＢＬＥ全体を表示画面の横中央に表示する方法が分かりません。

今までは
<table align="center"> </table>
で処理してきました。
これで画面の横位置は中央になるのですが

これを、ＨＴＭＬの中は
<table> </table>だけにして、align="center"の部分を

head内のＣＳＳの部分で処理できないかと思っています。

tableの外観やセル内の表示などは何とか分かったのですが、table全体の
位置を制御する方法が分かりません。

面倒でもお願いいたします。


▲このページのトップに戻る
364482Re:複数のtableをＣＳＳで修飾する方法テツヤ 2006/08/11-10:10

記事番号364427へのコメント
　あ、ごめん間違ってた。以下のでどうお？

<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<META http-equiv="Content-Style-Type" content="text/css">
<TITLE>test3</TITLE>
<STYLE>
.test {text-align:center}
</STYLE>
</HEAD>
<BODY>
<DIV class=test>
<TABLE>
<TR><TD>テスト
</TABLE>
</DIV>
</BODY>
</HTML>

▲このページのトップに戻る
364489Re:複数のtableをＣＳＳで修飾する方法しん 2006/08/11-10:47

記事番号364482へのコメント
テツヤさんは No.364482「Re:複数のtableをＣＳＳで修飾する方法」で書きました。

テツヤさんありがとうございました。

ＴＡＢＬＥもＤＩＶで囲むとは気がつかず、
「text-align:center」が使用できるとは考えても見ませんでした。

他の方より頂いた文書をＨＴＭＬ化する作業をしていまが、
この方は殆んどの文書をＥｘｃｅｌで作る方です。
セルの合成、分割などを多用して文章の修飾をしています。
Ｗｏｒｄと殆んどそんしょく無い位です。

この文書をＴａｂｌｅでＨｔｍにするのはさほどでもないのですが、今回
ＣＳＳで作ることに挑戦しています。

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

パソコントラブル解決・過去ログTOP  >  ログTOP  >  複数のtableをＣＳＳで修飾する方法

A1.本ページは参考になりましたか？　又はアドバイスがありますか？
解決　参考になった　参考にならなかった　アドバイスする

A2.何度目の訪問ですか？
初めて来た　　　数度目(２～４)　５回以上来ている　　 管理人:

A3.何か一言どうぞ(アドレスは書くことができません)

A4.アドレスがあればどうぞ(１つまで)


↑↑↑↑よろしければ押してください↑↑↑↑

何か一言(本ページで参考になったならないを含めて残してあります)
◎：解決　○：参考になった　×：参考にならなかった　！：アドバイスあり

参考回数投稿日時何か一言
(社)日本お助け隊
人間関係のトラブルの相談にのります。
電話相談無料。
和魂カウンセラー認定講座
和魂カウンセラー認定をしています。
全国イベントスケジュール
イベントが登録でき申込みできます。無料。