html - 空白：正常与空白：前行

问题描述

我有 html 表格，我想在其中显示换行符，因为用户可以添加大量潜在的文本。设置<td>s withstyle="white-space:pre-line"会导致表格显示换行符，就像我想要的那样。

但是，它还在单元格中添加了一堆我不想要的填充。消除这种额外填充（与所示示例相同style="white-space:normal"）但仍能识别换行符的正确方法是什么？

正在使用引导程序。

<td>s 与style="white-space:pre-line"。注意单元格内的额外填充。这增加了许多浪费的屏幕空间。

<td>与style="white-space:normal". 更紧凑（好），但不在表格单元格中显示换行符。

<div class="table-responsive" id="">
<table class="table table-hover table-condensed">
    <thead>
        <tr>
            @for (int j = 0; j < Model.Tables[i].TableRows[0].TableCells.Count(); j++)
            {
                <th class="header">Column Name</th>
            }
        </tr>
    </thead>
     <tbody class="list">
        @for (int k = 1; k <= Model.Tables[i].TableRows.Count() - 1; k++) 
        {
            <tr>
                @for (int l = 0; l < Model.Tables[i].TableRows[k].TableCells.Count(); l++)
                {
                    <td class="" style="white-space:pre-line;">
                        <a href="#EditTableCellModal">Cell Text </a>
                    </td>
                }
            </tr>
        }
    </tbody>
</table>
</div>

标签： htmlcsstwitter-bootstraphtml-table

根据来自 tstrand66 的响应和Replace line break characters with <br /> in ASP.NET MVC Razor view 中的线程，以下解决方案有效：

 <div class="table-responsive" id="">
   <table class="table table-hover table-condensed">
   <thead>
    <tr>
        @for (int j = 0; j < Model.Tables[i].TableRows[0].TableCells.Count(); j++)
        {
            <th class="header">Column Name</th>
        }
    </tr>
   </thead>
   <tbody class="list">
    @for (int k = 1; k <= Model.Tables[i].TableRows.Count() - 1; k++) 
    {
        <tr>
            @for (int l = 0; l < Model.Tables[i].TableRows[k].TableCells.Count(); l++)
            {
                <td class="" style="white-space:pre-line;">
                    <a href="#EditTableCellModal">@Html.Raw(Html.Encode(CellText).Replace("\n", "<br />"))</a>
                </td>
            }
        </tr>
    }
   </tbody>
  </table>
 </div>

我会注意到，这在使用 SelectPDF 的 HTML 到 PDF 转换中没有正确呈现，它只是显示了<br />与其余文本的内联。但如前所述，它在浏览器中按预期显示换行符。

html - 空白：正常与空白：前行

问题描述

解决方案

推荐阅读