表組の幅指定

 20%  50% 10% 20%
       

上記の表組のhtmlです。

<table class="mceEditable" border="2" width="100%" cellspacing="0" cellpadding="3">

                     罫線の太さ、幅が100％またはpxで指定、セルとセルの隙間、セル内の余白

<tbody>

<tr>

<td width="20%">&nbsp;20%</td>

<td width="50%">&nbsp;50%</td>

<td width="10%">10%</td>

<td width="20%">20%</td>

</tr>

表のサイズを全体を100％として、その内部のセルの割合を指定する。

<tr>

<td>&nbsp;</td>

<td>&nbsp;</td>

<td>&nbsp;</td>

<td>&nbsp;</td>

</tr>

</tbody>

</table>

サンプル

No 日付  試合名 勝敗 得点 対戦相手 場所
 01  02/17  新人戦 ● 26-50 山田  
 02  03/17  連習試合 ○ 60-18 十日市場 新治小

ｈｔｍｌ

<table class="mceEditable" style="height: 249px;" border="1" width="100%" cellspacing="0" cellpadding="3">

<tbody>

<tr>

<td style="text-align: center; border: 1px solid #000000; background-color: #c9c9f8;" width="5%">No</td>

<td style="text-align: center; border: 1px solid #000000; background-color: #c9c9f8;" width="10%">日付</td>

<td style="text-align: center; border: 1px solid #000000; background-color: #c9c9f8;" width="20%">&nbsp;試合名</td>

<td style="text-align: center; border: 1px solid #000000; background-color: #c9c9f8;" width="10%">勝敗</td>

<td style="text-align: center; border: 1px solid #000000; background-color: #c9c9f8;" width="15%">得点</td>

<td style="text-align: center; border: 1px solid #000000; background-color: #c9c9f8;" width="20%">対戦相手</td>

<td style="text-align: center; border: 1px solid #000000; background-color: #c9c9f8;" width="20%">場所</td>

</tr>

<tr>

<td style="text-align: center;">&nbsp;01</td>

<td style="text-align: center;">&nbsp;02/17</td>

<td style="text-align: center;">&nbsp;新人戦</td>

<td style="text-align: center;">●</td>

<td style="text-align: center;">26-50</td>

<td style="text-align: center;">山田</td>

<td style="text-align: center;">&nbsp;</td>

</tr>

<tr>

<td style="text-align: center;">&nbsp;02</td>

<td style="text-align: center;">&nbsp;03/17</td>

<td style="text-align: center;">&nbsp;連習試合</td>

<td style="text-align: center;">○</td>

<td style="text-align: center;">60-18</td>

<td style="text-align: center;">十日市場</td>

<td style="text-align: center;">新治小</td>

</tr>

</tbody>

</table>

ｈｔｍｌ

表組のセルの幅指定、高さ指定

<td width="auto" height=""></td>

表組のセンターリング

table タグの前に　<div align="center">を入れる

 width="500"に変更する

 

セル1 セル２
   

<div align="center">

<table align="" border="1" cellspacing="3" cellpadding="3" width="500" height="100%" class="mceEditable">

<tbody>

<tr>

<td style="text-align: center;">セル1</td>

<td style="text-align: center;">セル２</td>

</tr>

<tr>

<td>&nbsp;</td>

<td>&nbsp;</td>

</tr>

</tbody>

</table>

</div>