画面サイズを取得し、テーブルの高さ、幅を指定したい

解決済

質問者：hatokamome
質問日時：2011/10/01 11:21
回答数：3件

以下のような方法で、画面に合わせたテーブルを作成したいのですが、
うまくいきません。
幅の変数を単にタグ属性の値にしても動かない事が判りました。
どのようにしたら、値をセットできるのでしょうか。
ご存知の型がおられましたら教えてください。

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

<html>
<head>
<title>ウィンドウサイズを取得する</title>
</head>
<body>
<script Language="JavaScript"></script>

<table width="w" height="h">
<tr>
<td>
test
</td>
</tr>
</table>

</body>
</html>

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (3件)

ベストアンサー優先
最新から表示
回答順に表示

No.3ベストアンサー

回答者： k0021
回答日時：2011/10/02 06:29

%指定では

.w202 {width:21.3%;}
.w112 {width:11%;}
.w200 {border-style:none;width:99.5%;margin-top:0.3em;}

<table summary="古文書(駿河竜爪山由来)の写真"><col span="1" class="w202"><col span="1" class="w112"><col span="1" class="w202"><col span="1" class="w112"><col span="1" class="w202"><col span="1" class="w112"><tbody>

<img src="../kan/syou/keidai2.jpg" alt="keidai2_d.gif" class="w200">

実際に使用例ですが

段組で作成の場合でも％指定可能ですが

文字も画面サイズにより変更の場合は、JavaScriptにより文字サイズの変更が必要ですが。

<script Language="JavaScript"><!--は、誤りでは、ないですか<script type="text/javascript"><!--でないとフリーソフトAnother HTML-lint gatewayでエラーになりますが

summary="古文書(駿河竜爪山由来)の写真"もフリーソフトAnother HTML-lint gatewayでエラー対策で記述していますが

- 0
- 件

通報する

この回答へのお礼

ありがとうございます。
実現できました！

通報する

お礼日時：2011/10/30 20:45

No.2

回答者： ORUKA1951
回答日時：2011/10/01 18:12

もし、目的がレイアウトのためでしたら、間違いです。

【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから
非視覚系メディアでのレンダリングに際して問題を起こすことがあるため、単に文書内容を整形する目的だけで表を用いるべきでない。さらに、見た目のために表が用いられると、その表が大きなディスプレイのあるシステムで作られた場合、表を見るために水平スクロールを強いられることがある。こうした問題を最小限に押さえるため、著者は文書の整形には表ではなくスタイルシートを用いるべきである。
￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［11.1 表の概説( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )］より

【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから
・・・【中略】・・・
ページレイアウトの目的で表を用いる。
・・・【中略】・・・
こうしたテクニックによって、Webページはより複雑化し、限られた環境にしか適応しなくなり、相互運用性問題に悩まされることとなり、障害を持つ人々にアクセス障壁が設けられてしまう。
￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［14.1 スタイルシートの概説( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )］より

　また、tableは、内容の量によって自在に伸縮することが求められています。
11 表 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )
　画像のような置換要素の場合は、セルの幅はそれが収まるように広げられます。
11.3 視覚系ユーザエージェントによる表の整形 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )

　それがレイアウトの目的ではなく、表でしたら
<table style="width:100%">で良いです。

　

- 0
- 件

通報する

No.1

回答者： yui56544
回答日時：2011/10/01 16:51

単純に

<table width="100%" height="100%">
みたいなやり方はダメなんでしょうか？もっとも、高さはブラウザによってフォローされませんが。
高さを処理すると行数が増えた場合などかなり厄介なことになると思います。

javascriptで制御する場合、こういう方法も紹介されています、ご参考までに
http://www.kanaya440.com/contents/tips/javascrip …