如何防止表格单元格（而不是单个单元格）的列中的换行？

Question

如何防止表格列（不是单个单元格）中的自动换行符？

Answer 1

您可以使用CSS样式的空格：

white-space: nowrap;

Answer 2

为了完成：

#table_id td:nth-child(2)  {white-space: nowrap;}

用于将样式应用于the table_id表的2列。

这得到了所有主要浏览器的支持，IE从IE9开始支持这一点。

Answer 3

使用nowrap风格：

<td style="white-space:nowrap;">...</td>

这是CSS！

Answer 4

有几种方法可以做到这一点; 没有一个是简单明了的方式。

应用white-space：nowrap到<col>将不起作用; 只有四个CSS属性适用于<col>元素 - 背景颜色，宽度，边框和可见性。 IE7和更早版本用于支持所有属性，但那是因为他们使用了一个奇怪的表模型。 IE8现在与其他人匹配。

那么，你是如何解决这个问题的？

好吧，如果你可以忽略IE（包括IE8），你可以使用:nth-child()伪类从每一行中选择特定的<td> 。 您将使用td:nth-child(2) { white-space:nowrap; } td:nth-child(2) { white-space:nowrap; } 。 （这适用于此示例，但如果涉及任何rowpans或colspans，则会中断。）

如果你必须支持IE，那么你必须走很长的路，并为你想要影响的每个<td>应用一个类。 它很糟糕，但它们是休息时间。

从长远来看，有一些建议可以解决CSS中的这种缺陷，这样您就可以更轻松地将样式应用于列中的所有单元格。 你将能够做类似td:nth-col(2) { white-space:nowrap; } td:nth-col(2) { white-space:nowrap; } ，它会做你想要什么。

Answer 5

<td style="white-space: nowrap">

我认为nowrap属性已被弃用。 以上是首选方式。

Answer 6

只需添加

style="white-space:nowrap;"

例：

<table class="blueTable" style="white-space:nowrap;">
   <tr>
      <td>My name is good</td>
    </tr>
 </table>

Answer 7

在文本中放置不间断的空格而不是普通的空格。 在Ubuntu上，我使用（Compose Key）-space-space。

Answer 8

要将其应用于整个表，您可以将其放在table标记中：

<table style="white-space:nowrap;">

Answer 9

<table class="blueTable">
  <tr>
     <td>My name is good</td>
   </tr>
</table> 
<style>   
    table.blueTable td,
    table.blueTable th {
        white-space: nowrap;
        /* non-question related further styling */
        border: 1px solid #AAAAAA;
        padding: 3px 2px;
        text-align: left;
    }
</style>

这是具有值nowrap的空白属性的示例用法，bluetable是表的类，表下面是CSS样式。