Question

如何在剃须刀形式的文本区域中破坏单词？

我在表单中使用文本区域。当我在桌上写长文本时，它看起来很糟糕。我想要类似的内容，在输入一些文字后，我的文字会以...（点线形式）..然后在工具提示中显示完整的注释。

这是我的文本区域

 <div class="row">
   <div class="col-sm-6">
     @Html.LabelFor(model => model.Note)
     @Html.TextAreaFor(m => m.Note, new { @placeholder = "Enter Note", @class = "form-control", @style = "width: 100%; max-width: 100%;", @rows = "4"})
     @Html.ValidationMessageFor(model => model.Note, "", new { @class = "text-danger" })
   </div>
 </div>

和我的桌子

<td>@Html.DisplayFor(modelItem => item.ContactPerson2)</td>
<td>@Html.DisplayFor(modelItem => item.Note)</td>

Answer 1

我认为您的意思是希望将表（或更确切地说，您的 td ）中的文本用省略号（“ ...”）切除。太长。如果文本太长，您的textarea应该已经有滚动条。

实际上，您需要做一些事情。

您可以使用CSS的text-overflow: ellipsis。但是您可能还需要应用width，height，overflow: hidden和white-space: nowrap。您可能还需要将文本包装在div中。

然后，您可以使用title属性将全文显示为工具提示。

这是一个粗略的例子：

<td title="@Html.DisplayFor(model=> model.Note)"><div style="text-overflow: ellipsis; width:100px; height:20px; white-space:nowrap; overflow:hidden;">@Html.DisplayFor(model => model.Note)</div></td>

请注意，上述方法有很多更好的方法，但这只是一个起点。

如何以剃须刀的形式在文本区域中打断单词？

1 个答案: