在填充單元格中帶有換行符的JqueryMobile表

Question

我有一個與jQuery Mobile表有關的問題。 我有一個看起來像這樣的表（在下面的代碼中），它可以使用floatThead使用固定的標題水平滾動。
而且某些“ td”文本可能會很長，例如文章說明。
目前，它只使用整個空間，不添加任何“ br”。
通過這種行為，它減少了其他元素的可用空間。 順便說一下，內容將被動態添加。

我的問題是，如果文本變長，是否可以在該較長的“ td”文本中強制換行？ 表格單元格中的br排序？

 <div id="containerDiv">
<table class="ui-responsive ui-shadow gk-decorate tableClass" id="tableId" is="jqm-table" data-role="table">
  <thead>
    <tr>
      <th data-priority="1"><abbr>Header 1</abbr></th>
      <th data-priority="1"><abbr>Header 2</abbr></th>
      <th data-priority="1"><abbr>Header 3</abbr></th>
      <th data-priority="1"><abbr>Header 4</abbr></th>
      <th data-priority="1"><abbr>Header 5</abbr></th>
      <th data-priority="1"><abbr>Header 6</abbr></th>
    </tr>
  </thead>
  <tbody>
    <tr id="someId">
      <td>Content</td>
      <td>Content</td>
      <td>LooooooongContent</td>
      <td>RealllllllyLooooongContent</td>
      <td>Content</td>
      <td>Content</td>
    </tr>
     <tr id="someId">
      <td>Content</td>
      <td>Content</td>
      <td>LooooooongContent</td>
      <td>RealllllllyLooooongContent</td>
      <td>Content</td>
      <td>Content</td>
    </tr>
     <tr id="someId">
      <td>Content</td>
      <td>Content</td>
      <td>LooooooongContent</td>
      <td>RealllllllyLooooongContent</td>
      <td>Content</td>
      <td>Content</td>
    </tr>
    <tr id="someId">
      <td>Content</td>
      <td>Content</td>
      <td>LooooooongContent</td>
      <td>RealllllllyLooooongContent</td>
      <td>Content</td>
      <td>Content</td>
    </tr>
    <tr id="someId">
      <td>Content</td>
      <td>Content</td>
      <td>LooooooongContent</td>
      <td>RealllllllyLooooongContent</td>
      <td>Content</td>
      <td>Content</td>
    </tr>
  </tbody>
</table>

Answer 1

就目前情況而言，由於沒有設置寬度， <table>試圖完美地調整單元格的大小，您可以通過在<th>標記上設置width來實現。 這樣做將使具有空白的元素自動以<br />方式進入新行。

由於您的示例中似乎沒有空格。 您可以像這樣使用word-break ：

td {
  word-break: break-all;
}

我提供了一個示例 ，我不客氣地不給<th>標記添加寬度，並且懶惰並向表添加寬度，但是您可以看到使用word-break的結果