javascript - HTML テーブル セルの配置

Question

jQuery モバイルを使用しており、次のようなリストビューを作成したいと考えています。

達成するのは非常に簡単に見え、右側の列の右揃えを除いてほとんどすべてのものを手に入れました。右側の列の 3 つのセルごとにマージされることに注意してください。どんな助けでも大歓迎です。ありがとう。

更新: これが私のコードです:

<ul data-role="listview" id="mylist"><li><table><tr><td><label class="label1">EUR</label></td><td rowspan="3"><label class="price">1.3245</label></td></tr><tr><td><label class="label2">vs</label></td></tr><tr><td><label class="label3">USD</label></td></tr></table></li><li><table><tr><td><label class="label1">EUR</label></td><td rowspan="3"><label class="price">0.89</label></td></tr><tr><td><label class="label2">vs</label></td></tr><tr><td><label class="label3">GBP</label></td></tr></table></li></ul>

Answer 1

コードを投稿していないので、それ以上のことはできません。

ここを見る

コード：

jQuery('tr').each(function() {
  if (this.cells[1]) {
    this.cells[1].style.textAlign = 'right';
  }
});

Answer 2

しばらく苦労した後、私は問題が何であるかを理解しました。私のコードでは、いくつかのテーブルを作成しています。(それぞれに 1 つのテーブル<li>。) したがって、右の列のテキストを右揃えにすると、各テーブル内で右揃えになります。しかし、これらすべての表を上下に並べて表示すると、テキストが右揃えに見えません。解決策は、すべてのテーブルで右の列を右揃えにし、すべてのテーブルで固定幅を維持することです。.price{ font-size: 30px; width:200px; text-align: right; }

Joe W と Rafael de Souza の助けに感謝します。

Answer 3

text-align: right を追加して css を変更すると、必要な結果が得られるはずです。

前：

.price{ font-size: 30px;}

後：

.price{ font-size: 30px; text-align: right;}