html - 如果记录长度比列宽太长以及如何使所有列保持相同大小，如何放置点(...)

Question

这是我认为的表格。

<table>
@{var counter = 1; }
<tr>
    @foreach (var item in Model)
{
        <td>
            <div class="tdWidthFixed">
            <h4 class="m0" style="color:deepskyblue">@Html.DisplayFor(modelItem => item.courseName)</h4>
            @Html.DisplayFor(modelItem => item.courseSubject)<br>
            @Html.DisplayFor(modelItem => item.institute)
                </div>
        </td>
        if (counter % 3 == 0)  //Display 3 courses at a row
    {
            @:</tr><tr> 
    }
    counter++;
}
</tr>

一次销售中有三行。但是当显示冗长的结果行时会换行。我需要知道的是如果记录比列宽长，如何在行尾放置点(...)。以及如何使所有列的大小相同。

Answer 1

您可以为此使用 CSS。试试下面的代码。 http://codepen.io/ogzhncrt/pen/rVRYjY

 <h2>Lorem ipsum dolor sit amet, consectetur .</h2>
 <h2>Adipiscing elit. Nam ac ultricies augue.</h2>
 <h2>Donec sed mi magna. Ut convallis</h2>

<style>
    h2 {
       display: block;
       display: -webkit-box;
       width: 400px;
       margin: 0 auto;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
       overflow: hidden;
       text-overflow: ellipsis;
    }
</style>