【しばらく編集不可モードで運営します】 編集(管理者用) | 差分 | 新規作成 | 一覧 | RSS | FrontPage | 検索 | 更新履歴

Tableについて - &del(至急、) 皆様のご意見を戴けませんか?

目次

至急、 皆様のご意見を戴けませんか?

1. 表(Table)の書式について

私は、昨日の昼に、TextFormattingRules のページに 下記のような修正をしてしまいました。

しかし、冷静に考えるとUA,そのver., OS等によって、 必ずしも思う様に表示されない可能性に気が付きました。

ついては、一つでも問題があれば元に戻したいと考えますので、 ご意見をお願い申し上げます。  なお、思慮にかける行動については、 先に謝罪申し上げます。--mNeji

では、ご意見をお願いします。

2. TextFormattingRulesに記載したもの

,
, 同一行なら、セルを左隣に連結できる ,==,==
,
, Wikiの名前  ,  作者  , URL 
,
,Wiki,Ward Cunningham,http://www.c2.com/
,YukiWiki,Hiroshi Yuki,http://www.hyuki.com/
,WalWiki,Makio Tsukamoto,http://digit.que.ne.jp/
,

同一行なら、セルを左隣に連結できる
Wikiの名前作者URL
WikiWard Cunninghamhttp://www.c2.com/
YukiWikiHiroshi Yukihttp://www.hyuki.com/
WalWikiMakio Tsukamotohttp://digit.que.ne.jp/

3. Table に「ただ1つのコンマ(,)だけを書くと、そこの横線は太くなる」というような機能は存在しません

3.1 YukiWiki テキストソース

,
, 同一行なら、セルを左隣に連結できる ,==,==
,
, Wikiの名前  ,  作者  , URL 
,
,Wiki,Ward Cunningham,http://www.c2.com/
,YukiWiki,Hiroshi Yuki,http://www.hyuki.com/
,WalWiki,Makio Tsukamoto,http://digit.que.ne.jp/
,

3.2 展開された HTML ソース

<table border="1">
<tr><td></td></tr>
<tr><td align="center" colspan="3">同一行なら、セルを左隣に連結できる</td></tr>
<tr><td></td></tr>
<tr><td align="center">Wikiの名前</td><td align="center">作者</td><td align="center">URL</td></tr>
<tr><td></td></tr>
<tr><td>Wiki</td><td>Ward Cunningham</td><td><a href="http://www.c2.com/">http://www.c2.com/</a></td></tr>
<tr><td><a title="結城ウィキ" href="wiki.cgi?YukiWiki">YukiWiki</a></td><td>Hiroshi Yuki</td><td><a href="http://www.hyuki.com/">http://www.hyuki.com/</a></td></tr>
<tr><td><a title="YukiWiki2への機能追加とその仕様" href="wiki.cgi?WalWiki">WalWiki</a></td><td>Makio Tsukamoto</td><td><a href="http://digit.que.ne.jp/">http://digit.que.ne.jp/</a></td></tr>
<tr><td></td></tr>
</table>

3.3 スタイルシート設定

/* table */
table {
    margin: 5pt;
    padding: 5pt;
    background-color: #ccf;
}

td {
    margin: 1px;
    padding: 5px;
    background-color: #eef;
}

3.4 各 Web ブラウザによる描画の違い

4. 参考 - YukiWikiWalWiki における表(Table)の書式のリファレンス

4.1 表の作成(その1)

タグタグの記述方法説  明対応するHTMLタグ
,項目1,項目2 行頭に記述します 表を作成します <table border><tr><td>項目1</td><td>項目2</td></tr></table>

 ,項目,SL-C700,SL-B500,SL-A300 
 ,CPU,PXA250,PXA250,PXA210
 ,メモリ,ROM64MB、SDRAM32MB,ROM64MB、SDRAM32MB,SDRAM64MB
 ,液晶,640x480ドット、3.7型,240x320ドット、3.5型,240x320ドット、3.5型

項目SL-C700SL-B500SL-A300
CPUPXA250PXA250PXA210
メモリROM64MB、SDRAM32MBROM64MB、SDRAM32MBSDRAM64MB
液晶640x480ドット、3.7型240x320ドット、3.5型240x320ドット、3.5型

4.2 表の作成(その2)−セル内の文字配置を指定できます

タグタグの記述方法説  明対応するHTMLタグ
, 項目1 , 項目2 対象のセル内で使用 セル内の文字をセンタリングします <table border><tr><td align="center">項目1</td><td align="center">項目2</td></tr></table>
,項目1 ,項目2 対象のセル内で使用 セル内の文字を右寄せにします <table border><tr><td align="right">項目1</td><td align="right">項目2</td></tr></table>

 , 項目 , SL-C7300 , SL-B500 , SL-A300 
 ,CPU, PXA250, PXA250, PXA210
 ,メモリ,ROM64MB、SDRAM32MB,ROM64MB、SDRAM32MB,SDRAM64MB
 ,液晶,640x480ドット、3.7型,240x320ドット、3.5型,240x320ドット、3.5型

項目SL-C700SL-B500SL-A300
CPUPXA250PXA250PXA210
メモリROM64MB、SDRAM32MBROM64MB、SDRAM32MBSDRAM64MB
液晶640x480ドット、3.7型240x320ドット、3.5型240x320ドット、3.5型

4.3 表の作成(その3)−セルの連結ができます

タグタグの記述方法説  明対応するHTMLタグ
,==項目1,項目2 対象のセル内で使用 左側のセルを連結します <table border><tr><td colspan="2">項目1</td><td>項目2</td></tr></table>

 , 項目 , SL-C700 , SL-B500 , SL-A300 
 ,CPU,PXA250,==,PXA210
 ,メモリ,ROM64MB、SDRAM32MB,ROM64MB、SDRAM32MB,SDRAM64MB
 ,液晶,640x480ドット、3.7型,240x320ドット、3.5型,240x320ドット、3.5型

項目SL-C700SL-B500SL-A300
CPUPXA250PXA210
メモリROM64MB、SDRAM32MBROM64MB、SDRAM32MBSDRAM64MB
液晶640x480ドット、3.7型240x320ドット、3.5型240x320ドット、3.5型

4.4 表の作成(その4)−セル内の表示文字にタグに使用されているカンマ","を使用する方法

 , 項目 , SL-C700 , SL-B500 , SL-A300 
 ,CPU,PXA250,==,PXA210
 ,メモリ,ROM64MB、SDRAM32MB,ROM64MB、SDRAM32MB,SDRAM64MB
 ,液晶,640x480ドット、3.7型,240x320ドット、3.5型,240x320ドット、3.5型
 ,価格," \69,800"," \59,800"," \49,800"
        ↑このようにそのセルの文字列全体をダブルクォーテーションで囲みます

項目SL-C700SL-B500SL-A300
CPUPXA250PXA210
メモリROM64MB、SDRAM32MBROM64MB、SDRAM32MBSDRAM64MB
液晶640x480ドット、3.7型240x320ドット、3.5型240x320ドット、3.5型
価格\69,800\59,800\49,800

コメント

(Too many spams ... embedded comments are not allowed now, sorry.)

□表記例のテキストソース(行頭半角スペースの整形済みテキストとして記述しています)

 , 項目 , SL-C700 , SL-B500 , SL-A300 
 ,CPU,PXA250,==,PXA210
 ,メモリ,ROM64MB、SDRAM32MB,ROM64MB、SDRAM32MB,SDRAM64MB
 ,液晶,640x480ドット、3.7型,240x320ドット、3.5型,240x320ドット、3.5型
 ,価格," \69,800"," \59,800"," \49,800"
         ↑このようにそのセルの文字列全体をダブルクォーテーションで囲みます

□上記の HTML ソース

<pre>
 , 項目 , SL-C700 , SL-B500 , SL-A300 
 ,CPU,PXA250,==,PXA210
 ,メモリ,ROM64MB、SDRAM32MB,ROM64MB、SDRAM32MB,SDRAM64MB
 ,液晶,640x480ドット、3.7型,240x320ドット、3.5型,240x320ドット、3.5型
 ,価格,&quot; \69,800&quot;,&quot; \59,800&quot;,&quot; \49,800&quot;
        ↑このようにそのセルの文字列全体をダブルクォーテーションで囲みます
</pre>

□こちらのサイトのスタイルシート wiki.css (関連部分のみ抜粋)

body {
    margin: .5em .5em .5em .5em;
    color: black;
    font-family: "Verdana";
}

p, pre, ul, li, dl, dt, dd {
    line-height: 140%;
}

/* table */
table {
    margin: 5pt;
    padding: 5pt;
    background-color: #ccf;
}
 
td {
    margin: 1px;
    padding: 5px;
    background-color: #eef;
}