Question

我想将数据库中的段落显示为表格单元格。

结果是1行，忽略了它在数据库中的组织方式。例如，忽略'进入'（新行）

我想完全根据它在数据库中的编写方式来显示它。

例如，如果段落保存如下：

hello ,
my name is x.

我希望它显示的完全相同，而不是：

hello, myname is x.

Answer 1

您想要使用应用于相应<td>的CSS white-space:pre。要对所有表格单元格执行此操作，例如：

td { white-space:pre }

或者，如果您可以更改标记，则可以在内容周围使用<pre>标记。默认情况下，Web浏览器使用其用户代理样式表将相同的white-space:pre规则应用于此元素。

PRE元素告诉可视用户代理所附文本是“预先格式化”的。处理预格式化文本时，可视用户代理：


可能会保留空白区域。

可以使用固定间距字体呈现文字。

可能会禁用自动换行。

不得禁用双向处理。

Answer 2

将内容包装在<pre>（预格式化文本）标记

中

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

Answer 3

解决此问题的两个建议：

解决方案1：<div style="white-space:pre;">{database text}</div>或<pre>{database text}</pre>

如果您的文字没有html标签或css属性，这是一个很好的解决方案。例如，还允许维护标签。

解决方案2：将\n替换为<p></p> or <br/>

如果您只想添加断行，而不丢失其他文本属性或格式，则可以使用此解决方案。 php中的一个例子是$text = str_replace("\n","<br />",$database_text);

您也可以使用<p></p>或<div></div>，但这需要更多的文本解析。

Answer 4

在服务器端代码上，将新行（\n）替换为<br/>。

如果您使用的是PHP，则可以使用nl2br()

Answer 5

我在每一行之后使用html代码标签（见下文），它适用于我。

George Benson </br> 123 Main Street </br> New York, Ny 12344 </br>

Answer 6

嗨，我需要做同样的事情！不要问为什么，但我使用python生成一个html，需要一种方法来遍历列表中的项目，并让每个项目在一个表的单个单元格中占据一行。

我发现br标签对我来说效果很好。例如：

<!DOCTYPE html>
<HTML>
    <HEAD>
        <TITLE></TITLE>
    </HEAD>
    <BODY>
  <TABLE>
            <TR>
                <TD>
                    item 1 <BR>
                    item 2 <BR>
                    item 3 <BR>
                    item 4 <BR>
                </TD>
            </TR>
        </TABLE>
  </BODY>

这将产生我想要的输出。

Answer 7

下面的代码对我来说就像魔术>>

td { white-space:pre-line }

Answer 8

我在<br>内仅添加了<td>，效果很好，请打破常规！

Answer 9

就我而言，我可以这样使用。

td { white-space:pre-line , word-break: break-all}

Answer 10

如果您有一个包含\n的字符串变量，并且想要放入td内，则可以尝试

<td>
    {value
        .split('\n')
        .map((s, index) => (
            <React.Fragment key={index}>
                {s}
                <br />
            </React.Fragment>
        ))}
</td>

如何在表格单元格中显示多行文本

10 个答案: