html表格单元格中的强制换行符

我试图找到一种方法来强制在表格单元格中的文本内部的文本将变得比说最大允许大小的50％更长。html表格单元格中的强制换行符

如何在没有任何JS功能的情况下使用纯CSS的CSS？

来源

2011-07-27 dantuch

@Phil其onebiglonglineoftext所以这里给出的想法应该是足够的 – dantuch

它不会工作，如果它只有一个单词（见http://jsfiddle.net/NweWX/） – Fender

@Fender，谢谢... - 它工作罚款增加了像' – dantuch

我认为你正在试图做的是包装loooooooooooooong文字或网址，所以他们不把桌子的大小了。（我刚刚试图做同样的事情！）

你可以通过给它的风格word-wrap: break-word（你也可能需要设置它的宽度）很容易地与DIV做到这一点。

div { 
    word-wrap: break-word;   /* All browsers since IE 5.5+ */ 
    overflow-wrap: break-word;  /* Renamed property in CSS3 draft spec */ 
    width: 100%; 
}

然而，为表，则必须换一个DIV的内容（或其他块标记）或适用：table-layout: fixed。这意味着列的宽度不再是流体，而是仅基于第一行中列的宽度（或通过指定的宽度）定义。 Read more here。

示例代码：

table { 
    table-layout: fixed; 
    width: 100%; 
} 

table td { 
    word-wrap: break-word;   /* All browsers since IE 5.5+ */ 
    overflow-wrap: break-word;  /* Renamed property in CSS3 draft spec */ 
}

希望帮助别人。

来源

2013-11-26 00:19:25

我使用带断字的div来嵌套嵌套表格中的长单词。它不需要表格布局：固定样式。感谢您在IE，Chrome和FF中工作的解决方案：） – davidjmcclelland

嗨，大卫 - 是的，如果你的内容是*内部的DIV *（这是在一个表内），那么第一个片段就足够了。感谢 –

，接受改为this1 – dantuch

我建议你使用的包装股利或段落：

<td><p style="width:50%;">Text only allowed to extend 50% of the cell.</p></td>

而且可以使一个类出来的：

<td class="linebreak"><p>Text only allowed to extend 50% of the cell.</p></td> 

td.linebreak p { 
    width: 50%; 
}

所有这一切都假定你的意思是50％，在50细胞的百分比。

来源

2011-07-27 11:18:41 orlp

啊，对于后期更新抱歉，但@Fender评论说，如果我想打破单一的，tolonglineoftext，它并没有帮助。这是真正的问题。 – dantuch

如何居中这篇文章？ – zygimantus

这很难回答，如果不将HTML，但一般而言，您可以把：

style="width: 50%;"

在任一单元格，或将表格单元格内一个div，并把风格上。

但是一个问题是“50％是什么？”它是父元素的50％，可能不是你想要的。

发布您的HTML副本，也许你会得到更好的答案。

来源

2011-07-27 11:19:31 Ariel

您可以将文本放入宽度为50％的div（或其他容器）中。

http://jsfiddle.net/6gjsd/

来源

2011-07-27 11:19:37

-1

我认为这post会做一些帮助。将BR标签添加到要在表格单元格中打破的位置很简单。

来源

2016-06-13 08:16:13 l0o0

html表格单元格中的强制换行符

回答

相关问题