blocks|key|335396|text|style="white-space:pre-wrap;+word-wrap:break-word"|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|335397|这将解决新线路的问题。pre标签会添加比所需的更多的CSS。|unstyled|335398|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|J|8|@]|9|@]|A|$]]|$1|G|3|-4|5|F|7|K|8|@]|9|@]|A|$]]]|H|$]]

<pre><code>style="white-space:pre-wrap; word-wrap:break-word"
</code></pre>

This would solve the issue of new line.
pre tag would add additional CSS than required.

blocks|key|335229|text|将内容包装在<pre>+(预格式化文本)标记中|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|335230|<pre>hello+,
my+name+is+x.</pre>|code-block|syntax|javascript|335231|entityMap^0|6|5|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|P|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Q|8|@]|D|@]|E|$]]]|L|$]]

Wrap the content in a <code>&lt;pre&gt;</code> (pre-formatted text) tag

<pre><code>&lt;pre&gt;hello ,
my name is x.&lt;/pre&gt;
</code></pre>

blocks|key|335323|text|解决这个问题的两个建议：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|335324|解决方案1：<div+style="white-space:pre;">{database+text}</div>或<pre>{database+text}</pre>|offset|length|style|CODE|335325|如果您的文本没有html标记或css属性，这是一个很好的解决方案。例如，还允许维护选项卡。|335326|解决方案2:用+or+ 替换\n|335327|如果您只想在不丢失其他文本属性或格式的情况下添加断线，这是一种解决方案。在php中的一个例子是$text+=+str_replace("\n","<br+/>",$database_text);。|335328|您也可以使用或<div></div>，但这需要更多的文本解析。|335329|entityMap^0|0|6|1F|1M|Q|0|0|7|G|P|2|0|1B|1E|0|6|7|E|B|0^^$0|@$1|2|3|4|5|6|7|R|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|S|8|@$D|T|E|U|F|G]|$D|V|E|W|F|G]]|9|@]|A|$]]|$1|H|3|I|5|6|7|X|8|@]|9|@]|A|$]]|$1|J|3|K|5|6|7|Y|8|@$D|Z|E|10|F|G]|$D|11|E|12|F|G]]|9|@]|A|$]]|$1|L|3|M|5|6|7|13|8|@$D|14|E|15|F|G]]|9|@]|A|$]]|$1|N|3|O|5|6|7|16|8|@$D|17|E|18|F|G]|$D|19|E|1A|F|G]]|9|@]|A|$]]|$1|P|3|-4|5|6|7|1B|8|@]|9|@]|A|$]]]|Q|$]]

Two suggestions to solving this problem:

SOLUTION 1: <code>&lt;div style="white-space:pre;"&gt;{database text}&lt;/div&gt;</code> or <code>&lt;pre&gt;{database text}&lt;/pre&gt;</code>

This is good solution if your text has no html tags or css properties. Also allows to maintain tabs for example.

SOLUTION 2: Replace <code>\n</code> with <code>&lt;p&gt;&lt;/p&gt; or &lt;br/&gt;</code>

This is a solution if you would just like to add break-lines, without losing other text properties or formatting. 
An example in php would be <code>$text = str_replace("\n","&lt;br /&gt;",$database_text);</code>

You can also use <code>&lt;p&gt;&lt;/p&gt;</code> or <code>&lt;div&gt;&lt;/div&gt;</code>, but this requires a bit more text parsing.

blocks|key|552016|text|嗨，我需要做同样的事情！不要问为什么，我是用python生成html的，我需要一种方法来遍历列表中的项目，并让每个项目在表格的单个单元格中占据自己的一行。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|552017|我发现br标签对我很有效。例如：|552018|<!DOCTYPE+html>
<HTML>
++++<HEAD>
++++++++<TITLE></TITLE>
++++</HEAD>
++++<BODY>
++<TABLE>
++++++++++++<TR>
++++++++++++++++<TD>
++++++++++++++++++++item+1+ 
++++++++++++++++++++item+2+ 
++++++++++++++++++++item+3+ 
++++++++++++++++++++item+4+ 
++++++++++++++++</TD>
++++++++++++</TR>
++++++++</TABLE>
++</BODY>|code-block|syntax|javascript|552019|​|552020|这将产生我想要的输出。|552021|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|R|8|@]|9|@]|A|$]]|$1|K|3|L|5|6|7|S|8|@]|9|@]|A|$]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

Hi I needed to do the same thing! Don't ask why but I was generating a html using python and needed a way to loop through items in a list and have each item take on a row of its own WITHIN A SINGLE CELL of a table. 

I found that the br tag worked well for me. For example:

<pre><code>&lt;!DOCTYPE html&gt;
&lt;HTML&gt;
 &lt;HEAD&gt;
 &lt;TITLE&gt;&lt;/TITLE&gt;
 &lt;/HEAD&gt;
 &lt;BODY&gt;
 &lt;TABLE&gt;
 &lt;TR&gt;
 &lt;TD&gt;
 item 1 &lt;BR&gt;
 item 2 &lt;BR&gt;
 item 3 &lt;BR&gt;
 item 4 &lt;BR&gt;
 &lt;/TD&gt;
 &lt;/TR&gt;
 &lt;/TABLE&gt;
 &lt;/BODY&gt;
</code></pre>



This will produce the output that I wanted.

blocks|key|335616|text|下面的代码对我来说就像魔术一样，>>|type|unstyled|depth|inlineStyleRanges|entityRanges|data|335617|td+{+white-space:pre-line+}|code-block|syntax|javascript|335618|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

the below code works like magic to me >>

<pre><code>td { white-space:pre-line }
</code></pre>

blocks|key|551878|text|在服务器端代码中，将新行(\n)替换为 。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|551879|如果你使用的是PHP，你可以使用nl2br()|551880|entityMap|0|LINK|mutability|MUTABLE|url|http://php.net/nl2br^0|D|2|J|5|0|G|7|G|7|0|0^^$0|@$1|2|3|4|5|6|7|P|8|@$9|Q|A|R|B|C]|$9|S|A|T|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|U|8|@$9|V|A|W|B|C]]|D|@$9|X|A|Y|1|Z]]|E|$]]|$1|H|3|-4|5|6|7|10|8|@]|D|@]|E|$]]]|I|$J|$5|K|L|M|E|$N|O]]]]

On your server-side code, replace the new lines (<code>\n</code>) with <code>&lt;br/&gt;</code>.

If you're using PHP, you can use <a href="http://php.net/nl2br" rel="noreferrer"><code>nl2br()</code></a>

blocks|key|335365|text|我在每一行后面使用html+code标签(见下文)，它对我很有效。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|335366|George+Benson++123+Main+Street++New+York,+Ny+12344+|offset|length|style|CODE|335367|entityMap^0|0|0|J|K|L|16|O|0^^$0|@$1|2|3|4|5|6|7|J|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|K|8|@$D|L|E|M|F|G]|$D|N|E|O|F|G]|$D|P|E|Q|F|G]]|9|@]|A|$]]|$1|H|3|-4|5|6|7|R|8|@]|9|@]|A|$]]]|I|$]]

I use the html code tag after each line (see below) and it works for me. 

<code>George Benson &lt;/br&gt;</code>
<code>123 Main Street &lt;/br&gt;</code>
<code>New York, Ny 12344 &lt;/br&gt;</code>

blocks|key|335454|text|我只在<td>中添加了 ，它工作得很好，打破这条线吧！|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|335455|entityMap^0|3|4|B|4|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]|$9|K|A|L|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|M|8|@]|D|@]|E|$]]]|G|$]]

I added only <code>&lt;br&gt;</code> inside the <code>&lt;td&gt;</code> and it works good, break the line!

blocks|key|335710|text|对于我的情况，我可以这样使用。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|335711|td+{+white-space:pre-line+,+word-break:+break-all}|code-block|syntax|javascript|335712|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

For my case, I can use like this.
<pre><code>td { white-space:pre-line , word-break: break-all}
</code></pre>

blocks|key|552111|text|如果您有一个包含\n的字符串变量，并且希望将其放入td中，您可以尝试|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|552112|<td>
++++{value
++++++++.split('\n')
++++++++.map((s,+index)+=>+(
++++++++++++<React.Fragment+key={index}>
++++++++++++++++{s}
++++++++++++++++<br+/>
++++++++++++</React.Fragment>
++++++++))}
</td>|code-block|syntax|javascript|552113|entityMap^0|8|2|P|2|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]|$9|P|A|Q|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|R|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|S|8|@]|D|@]|E|$]]]|L|$]]

If you have a string variable with <code>\n</code> in it, that you want to put inside <code>td</code>, you can try

<pre><code>&lt;td&gt;
 {value
 .split('\n')
 .map((s, index) =&gt; (
 &lt;React.Fragment key={index}&gt;
 {s}
 &lt;br /&gt;
 &lt;/React.Fragment&gt;
 ))}
&lt;/td&gt;
</code></pre>

I want to show a paragraph from database into a table cell.

The result is a large 1 line, ignoring how its organised in database.
ignoring 'enters' for example (new lines)

I want to show it exactly according to how it's written in database.

For example if paragraph is saved like this:

<pre><code>hello ,
my name is x.
</code></pre>

I want it to be showed exactly like that, instead of:

<pre><code>hello, myname is x.
</code></pre>

How to show multiline text in a table cell

数据库

服务器

我想要将一个段落从数据库显示到表格单元格中。结果是一条很大的1行，忽略了它在数据库中的组织方式。例如，忽略'enters‘(新行)我想完全按照它在数据库中的编写方式来显示它。例如，如果段落按如下方式保存：hello ,my name is x.我希望它完全像这样显示，而不是：hello, myname is x.

问如何在表格单元格中显示多行文字
EN

回答 10

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在表格单元格中显示多行文字EN

回答 10

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在表格单元格中显示多行文字
EN