□表の歪みについて

Wiki文法で表を作る場合、最大のネックが「行末の ||（縦棒×２本）」です。
通常のHTMLでは、表（ <TABLE> ～ </TABLE> ）全体で、行（ <TR> ～ </TR> ）の作り、
その中でセル（ <TH> ～ </TH> または <TD> ～ </TD> ）を入れることができます。

【サンプル文】
以下のサンプル文をコピーし、「メモ帳」などでペーストします。
そして、ファイルを「サンプル文.html」で保存し、Internet Explorerを開くと見ることができます。

<TABLE style=" background:#ffffff; padding:0px; width=300px;">
<TR>
<TD style=" background:#00ffff; padding:0px;">A-1</TD>
<TD style=" background:#ff00ff; padding:0px;">A-2</TD>
<TD style=" background:#ffff00; padding:0px;">A-3</TD>
</TR>
<TR>
<TD style=" background:#00ffff; padding:0px;">B-1</TD>
<TD style=" background:#ff00ff; padding:0px;">B-2</TD>
<TD style=" background:#ffff00; padding:0px;">B-3</TD>
</TR>
</TABLE>

しかし、「Wiki文法」で複数のセル（例：A-1、A-2、A-3など）を使い、
行（例：「A-1」＋「A-2」＋「A-3」）と、行（例：「B-1」＋「B-2」＋「B-3」）をつなぐ場合には、
その中に、１行（例：｜|<#cccccc' colspan=3 style=' padding:0px; width:300px;' || ）を入れなければならないんです。
※基本的に、背景色を「#ffffff」（白色）にしますが、今回は「#cccccc」（灰色）にしています。

【例文】

||<#cccccc' colspan=3 style=' padding:0px; width:300px;' ``||
||<#00ffff' style=' padding:0px;' ``■A-1
||<#ff00ff' style=' padding:0px;' ``■A-2
||<#ffff00' style=' padding:0px;' ``■A-3
||<#cccccc' colspan=3 style=' padding:0px; width:300px;' ``||
||<#00ffff' style=' padding:0px;' ``■B-1
||<#ff00ff' style=' padding:0px;' ``■B-2
||<#ffff00' style=' padding:0px;' ``■B-3

【実際】


■A-1	■A-2	■A-3

■B-1	■B-2	■B-3

それと、１行の「｜|<#ffffff' colspan=3 style=' padding:0px; width:300px;' ||」なんですが、
「padding:0px; ＝ゼロ」に入れても、実際に見ると「ゼロの行なのに見える行」になります。
例として、背景色を「#00ffff」、「#ff00ff」、「#ffff00」に入れました。

※内容（文字など）の幅は「width:300px;」なので、幅は見えますが、
　内容の高さ「height」は省略されていますので、内容の高さは「height:0px;（ゼロ）」になります。

【例文】

||<#00ffff' colspan=3 style=' padding:0px; width:300px;' ``||

||<#ff00ff' colspan=3 style=' padding:0px; width:300px;' ``||

||<#ffff00' colspan=3 style=' padding:0px; width:300px;' ``||

【実際】

【結論】
複数のセルが入る行（例：「A-1」＋「A-2」＋「A-3」）と、行（例：「B-1」＋「B-2」＋「B-3」）に隙間を入れる場合は、
「｜|<#ffffff' colspan=3 style=' padding:0px; width:300px;' ||」が絶対必要となります。

もし単体だけのセルであれば、「｜|<#ffffff' colspan=3 style=' padding:0px; width:300px;' ||」は入りません。

【例文】

||<#00ffff' style=' padding:0px; width:300px;' ``■A-1||
||<#ff00ff' style=' padding:0px;' ``■A-2||
||<#ffff00' style=' padding:0px;' ``■A-3||
||<#00ffff' style=' padding:0px;' ``■B-1||
||<#ff00ff' style=' padding:0px;' ``■B-2||
||<#ffff00' style=' padding:0px;' ``■B-3||

【実際】

■A-1

■A-2

■A-3

■B-1

■B-2

■B-3

日	月	火	水	木	金	土
						1
2	3	4	5	6	7	8
9	10	11	12	13	14	15
16	17	18	19	20	21	22
23	24	25	26	27	28	29
30	31

日

月

火

水

木

金

土

【びーにぃ】の、Wiki攻略本

過去の投稿日別表示

2005年10月30日

□表の歪みについて

□表の歪みについて

コメント（9）

トラックバック（6）

トラックバックされた記事

□全体幅の問題

□全体幅の問題

コメント（7）

トラックバック（1）

トラックバックされた記事

Yahoo!ブログからのお知らせ

最新の記事一覧

最新のコメント

最新のトラックバック

過去の記事一覧

Yahoo!からのお知らせ

ブログリンク

仲間関係

Wiki文法関連

フラッシュ関連

ブログ素材

音楽関連

常連さん

ブログ関連

訪問者履歴

よしもとブログランキング