HTMLテーブル内の数字の書式を整えるためのエレガントな方法

Question

HTMLテーブルに数字を整列させるエレガントな方法はありますか？

これ：たとえば

0/0ヘルツ

600分の10ヘルツ

1200分の1200 HZ

ようにする必要がありますthis：

0/ 0 Hz 

    10/600 Hz 

1200/1200 HZ 

私のテーブルには、次のようになります。https://jsfiddle.net/cwwxrL8a/

Answer 1

エレガントは、この場合には非常に、非常に主観的です。 ..

これは、テーブルセル内のコンテンツを混乱させたり、テーブルを台無しにするかどうかによって異なります。これは、この表にデータが取り込まれる方法によって異なります。

私は個人的にはたくさんのセルを持つテーブルを作るのが好きではありません。ちょうど/で満ちている列があるのは間違いです。

私は2つのデータ部分の周りを包囲しています。このための落ち込みは、幅の設定が必要です。しかし、それはスタイリングのためのテーブルを使用していないということです。

あなたのためのフィドル：https://jsfiddle.net/9183ao41/2/

はあなたの毒を選択してください。

Answer 2

が、これはあなたが何を意味するか程度ですか？

table { 
 
    width: 100%; 
 
} 
 
tr { 
 
    text-align: center; 
 
} 
 
th { 
 
    border: 1px solid black; 
 
    width: 20%; 
 
} 
 
td { 
 
    border: 1px solid black; 
 
    width: 20%; 
 
}

<table> 
 
    <tr> 
 
    <th>Type</th> 
 
    <th></th> 
 
    <th>Freq</th> 
 
    <td></td> 
 
    <th>description</th> 
 
    </tr> 
 
    <tr> 
 
    <td>RS64</td> 
 
    <td>0</td> 
 
    <td>/</td> 
 
    <td>1200 Hz</td> 
 
    <td>test</td> 
 
    </tr> 
 
    <tr> 
 
    <td>SE1225<br></td> 
 
    <td>0</td> 
 
    <td></td> 
 
    <td>1200 Hz</td> 
 
    <td>test</td> 
 
    </tr> 
 
    <tr> 
 
    <td>SE1226</td> 
 
    <td>0</td> 
 
    <td></td> 
 
    <td>1200 Hz</td> 
 
    <td>test</td> 
 
    </tr> 
 
</table>

Answer 3

私は何がやりたいことは、そのテーブル内のテキストの各部分にIDS /クラスを与えることで可能であることを知りません。または@ジョハネスが言ったように、それを自分のセルに入れることです。私がお勧めすることができます

ことの一つは、あなたが望むものフィット外観を見つけることができるかどうかを確認するためにpadding、word-spacingとletter-spacingで遊んでされています

.freq{ 
    text-align: right; 
    padding-bottom: 3px; 
    padding-right: 150px; 
    word-spacing: 5px; 
    letter-spacing: 2px; 
}