ホームページビルダー17 表のサイズについて

締切済

質問者：kaochan1102
質問日時：2013/07/12 12:00
回答数：3件

現在、未熟ながらも頑張ってホームページビルダー17の
フルCSSテンプレートを使ってホームページを作っております。

ページの中に行数16、列数25の表を挿入したく表を作ってみますが
表の中に文字を入れるとどんどん表が大きくなりページから大きく
はみ出してしまい困っております。

表内に打ち込む文字は、ポイント制度の表なので1つのセル内に「★」マーク
1つのみしか入れない単純な表です。なんとか表自体を小さくコンパクトな物にして
ページ内に収まるよう設置したいのですが方法があれば教えて頂けないでしょうか？

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

通報する

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

質問の本文を隠す

回答 (3件)

最新から表示
回答順に表示

No.3

回答者： DrFell
回答日時：2013/07/12 20:42

セル内が１文字のみなら、表のタイトルも１文字にすれば、場合によっては縦書き風に簡単になります。

つまり、上の表タイトルと左の表タイトルの掛け合わせが★なのでしょ？

上の表タイトルの幅を1em(字)指定おけば縦読みできる表示に簡単にお望みの物ができる筈です。長音（ー）等が交じるとまずいですがね。

つまり、１文字ごとに折り返されて

こ
う
な
る
よ
う
に

する。文字をセンターに揃えれば、上手くいくのでは？

cssがわかるなら
thead th{width:1em;text-align:center;line-height:1;}
ということです。

- 0
- 件

通報する

No.2

回答者： ORUKA1951
回答日時：2013/07/12 16:11

　ビルダーのフルCSSなんて嘘ですから(^^)

ひとつのセルに一文字しか入らないのでしたら、25列でしたらタイトル列が数文字だとしたら通常のディスプレイ幅なら収まるはずです。
　ビルダーじゃ面倒(難しい)なので、テキストエディタで作ってみました。どうせビルダーじゃ、スタイルシートのセレクタなんか書けませんから手作業で指定するしかありません。
　ビルダーなどオーサリングツールは、HTMLやCSSを良く知ってなきゃ使いこなせません。逆じゃないですよ!!!。その上にツールのマニュアルも理解しなければならないので大変です。文書構造を読み取って最適なセレクタを書くなんて事は人工知能でも大変な作業になるのです。--ツールでは絶対に不可能です。

☆下記サンプルはHTML4.01strict + CSS3 で、どのブラウザでも標準モードで動作します。
　Another HTML-lint 5( http://www.htmllint.net/html-lint/htmllint.html# )
　のDATA入力でチェック済み
☆タブは＿に置換してあるので戻すこと。

[サンプル]Shif_JIS
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
＿<meta http-equiv="content-type" content="text/html; charset=Shift_JIS">
＿<title>サンプル</title>
＿<meta name="author" content="ORUKA1951">
＿<meta http-equiv="Content-Style-Type" content="text/css">
＿<link rev="made" href="mailto:oruka1951@hoge.com" title="send a mail" >
＿<link rel="START" href="../index.html">
＿<style type="text/css">

＿</style>
</head>
<body>
＿<div class="header">
＿＿<h1>タイトル</h1>
＿＿<p>このページでは・・・・</p>
＿</div>
＿<div class="section">
＿＿<h2>見出し</h2>
＿＿<table summary="pointList" border="1">
＿＿＿<thead>
＿＿＿＿<tr>
＿＿＿＿＿<td></td><th abbr="1">６月１日</th><th abbr="2">６月２日</th><th abbr="31">６月３日</th><th abbr="41">６月４日</th><th abbr="5">６月５日</th><th abbr="6">６月６日</th><th abbr="7">６月７日</th><th abbr="8">６月８日</th><th abbr="9">６月９日</th><th abbr="101">６月10日</th><th abbr="11">６月11日</th><th abbr="12">６月12日</th><th abbr="13">６月13日</th><th abbr="14">６月14日</th><th abbr="15">６月15日</th><th abbr="16">６月16日</th><th abbr="17">６月17日</th><th abbr="18">６月18日</th><th abbr="19">６月19日</th><th abbr="20">６月20日</th><th abbr="21">６月21日</th><th abbr="22">６月22日</th><th abbr="23">６月23日</th><th abbr="24">６月24日</th><th abbr="25">６月25日</th>
＿＿＿＿</tr>
＿＿＿</thead>
＿＿＿<tbody>
＿＿＿＿<tr>
＿＿＿＿＿<th abbr="伊藤">伊藤博文</th><td></td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td></td><td>☆</td><td></td><td>☆</td><td></td><td></td><td></td><td>☆</td>
＿＿＿＿</tr>
＿＿＿＿<tr>
＿＿＿＿＿<th abbr="黒田">黒田清隆</th><td></td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td></td><td>☆</td><td></td><td>☆</td><td></td><td></td><td></td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td>
＿＿＿＿</tr>
＿＿＿＿<tr>
＿＿＿＿＿<th abbr="三條">三條実美</th><td></td><td></td><td>☆</td><td>☆</td><td></td><td></td><td></td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td>
＿＿＿＿</tr>
＿＿＿＿<tr>
＿＿＿＿＿<th abbr="山縣">山縣有朋</th><td>☆</td><td>☆</td><td>☆</td><td></td><td></td><td></td><td></td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td></td><td></td><td></td><td></td><td>☆</td><td>☆</td><td>☆</td>
＿＿＿＿</tr>
＿＿＿＿<tr>
＿＿＿＿＿<th abbr="松方">松方正義</th><td>☆</td><td>☆</td><td></td><td></td><td>☆</td><td></td><td></td><td></td><td>☆</td><td>☆</td><td></td><td></td><td></td><td></td><td></td><td>☆</td><td></td><td>☆</td><td></td><td>☆</td><td>☆</td><td></td><td></td><td>☆</td><td>☆</td>
＿＿＿＿</tr>
＿＿＿</tbody>
＿＿</table>
＿</div>
＿<div class="footer">
＿＿<h2>文書情報</h2>
＿＿<dl class="documentHistry">
＿＿＿<dt id="FIRST-PUBLISHED">First Published</dt>
＿＿＿<dd>2012-08-10</dd>
＿＿</dl>
＿＿<address>© ORUKA1951 2012 - 2016 All Rights Reserved mailto:*****</address>
＿</div>
</body>
</html>