首頁 > web前端 > css教學 > 如何在 HTML 中使表格單元格內容換行?

如何在 HTML 中使表格單元格內容換行?

DDD
發布: 2024-10-27 08:57:03
原創
626 人瀏覽過

How to Make Table Cell Content Wrap in HTML?

如何強製表格單元格要換行的內容

在提供的程式碼中,

中的文字是提交時元素會拉伸。要解決此問題並確保文字在單元格內換行,可以採取以下步驟:

解決方案

  1. 表格佈局:
    新增表格-佈局:固定到;元素。此屬性指定表格將具有固定佈局,強制其列具有指定的寬度。
  2. 自動換行:
    將 word-wrap:break-word 加到 < ;td>元素。此屬性允許在表格儲存格內自動換行,從而允許長文字分成多行。
  3. 範例

    <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>
    登入後複製



以上是如何在 HTML 中使表格單元格內容換行?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板