如何在 HTML 中使表格单元格内容换行？

如何强制表格单元格要换行的内容

在提供的代码中，

中的文本是提交时元素会拉伸。要解决此问题并确保文本在单元格内换行，可以采取以下步骤：

解决方案

1. 表格布局：
   添加表格-布局：固定到；元素。此属性指定表格将具有固定布局，强制其列具有指定的宽度。
   自动换行：
   将 word-wrap:break-word 添加到 < ；td>元素。此属性允许在表格单元格内自动换行，从而允许长文本分成多行。

   示例

   <br> <br> <br> 表 {border-collapse:collapse;表格布局：固定；宽度：310px;}<br> 表 td {border:solid 1px #fab;宽度：100px；自动换行:断字;}<br> 风格><br><p><br> </p><pre class="brush:php;toolbar:false">  <tr>
        <td>1</td>
        <td>Lorem Ipsum</td>
        <td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. </td>
     </tr>
     <tr>
        <td>2</td>
        <td>LoremIpsumhasbeentheindustry'sstandarddummytexteversincethe1500s,whenanunknown</td>
        <td>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</td>
     </tr>
     <tr>
        <td>3</td>
        <td></td>
        <td>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna...</td>
     </tr>

   
   
   
   

   演示：

   
   

   
   

   <pre class="brush:php;toolbar:false">   table td {border:solid 1px #fab; width:100px; word-wrap:break-word;}

          <桌子></p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">      <tr>
            <td>1</td>
            <td>Lorem Ipsum</td>
            <td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. </td>
         </tr>
         <tr>
            <td>2</td>
            <td>LoremIpsumhasbeentheindustry'sstandarddummytexteversincethe1500s,whenanunknown</td>
            <td>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</td>
         </tr>
         <tr>
            <td>3</td>
            <td></td>
            <td>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna...</td>
         </tr>
      </table>
   

   登录后复制

   ”

以上是如何在 HTML 中使表格单元格内容换行？的详细内容。更多信息请关注PHP中文网其他相关文章！