HTML：不支持自动换行答案

【问题标题】：HTML: Word-Wrap not supportingHTML：不支持自动换行
【发布时间】：2014-09-03 08:20:25
【问题描述】：

从下面的 html 代码中，我想在没有水平滚动条的页面中显示完整的表格。我想将 html 表格宽度设置为适合屏幕。 td 中有连续文本，我想将其拆分并以多行显示，以使表格宽度不会超出页面。

为此，我使用了自动换行属性，但它不起作用。请建议我可能的解决方案。

代码：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>
    <table style="table-layout:fixed;">
         <tr>
            <td style="word-wrap:break-word;">jhdjhfjsjkfhjshdjfhjshfsbfsjkshdfjhsfjsdfdfjsndjkfnjsdnfsdfnsdjfnnsdjfnsdjnfjsdnf,sdnmfksdfsdfsdfsdnfklsdmklfmsdfsd,fsdfsdkfksdnmfnmsdkfnmsdmfmdfmd,.mf,dmf,msd,fm,sdmf,.smd,.fms,dmfms,dmf,s.dmf,.smdf,.smd,fmsdfm,.sdm,f.sdm,f.msd,.fms,.dmf,.sdmf,.sdmf,.smd,.fmsd,mf,.sdmf,.smd,.fmsd,.fm,sdmf,msd,.fms,.dmf,.sdmf,.sdmfsdmfsdf,.sdf,sdfsdfsdfsdf</td>  
            <td style="word-wrap:break-word;">jhdjhfjsjkfhjshdjfhjshfsbfsjkshdfjhsfjsdfdfjsndjkfnjsdnfsdfnsdjfnnsdjfnsdjnfjsdnf,sdnmfksdfsdfsdfsdnfklsdmklfmsdfsd,fsdfsdkfksdnmfnmsdkfnmsdmfmdfmd,.mf,dmf,msd,fm,sdmf,.smd,.fms,dmfms,dmf,s.dmf,.smdf,.smd,fmsdfm,.sdm,f.sdm,f.msd,.fms,.dmf,.sdmf,.sdmf,.smd,.fmsd,mf,.sdmf,.smd,.fmsd,.fm,sdmf,msd,.fms,.dmf,.sdmf,.sdmfsdmfsdf,.sdf,sdfsdfsdfsdf</td>  
         </tr>
    </table>
</body>
</html>

【问题讨论】：

标签： css html

【解决方案1】：

表格（以及进一步扩展的单元格）没有限制，这意味着它会伸展以适应其中的内容，因此您的文字没有理由被打断。

试着给你的桌子一个宽度：

table{
    width:100%;
}

JSFiddle

【讨论】：

【解决方案2】：

要使用style="word-wrap: break-word;，您必须固定外部标签宽度。

table{
     width:100%;
}

【讨论】：