1

我正在尝试构建专为手机设计的网络应用程序。但是我有一些非常大的链接。如果文本不适合，我想要做的是打破这些字符串，如果适合则使用整个字符串。

我尝试使用word-wrap:break-word：

.breakWord {
    width: 100% 
    word-wrap: break-word;
}

我的html是：

<table>
  <tr>
   <td rowspan="2" style="width:10%" >picture</td>
   <td colspan="2" style="width:90%" class="breakWord">link</td>
  </tr> 
   <tr>
    <td style="width:80%">info1</td>
   <td style="width:10%">info2</td>
   </tr>
  <tr>
  </tr> 
</table>

此代码不适合页面 - 出现水平滚动条。

如何使文本适合？

4

1 回答 1

0

如果您更正源代码中的错误，它将起作用。

  • width:100%从样式块中删除。它与 中的内联样式冲突td，并且遗漏了一个分号
  • colpan应该colspan

另外，我相信某些浏览器在遇到td带有宽度样式的 colspanned 时会感到困惑。您可以安全地删除style="width:90%"，因为下面的两个tds 已经正确设置了宽度。

编辑：
所以它不适用于任何地方。根据this question的答案，问题出在表格上：首先计算表格的宽度，然后将10％和90％作为计算的宽度，而不是屏幕上的可用宽度。
所以一个可能的解决方案是给表格一个特定的宽度，并将其表格布局设置为固定。

<table style="width:100%; table-layout:fixed">
于 2012-06-11T06:51:40.537 回答