我的財產有問題text-overflow:ellipsis。
特別是虛線末端的三個點不顯示。
由于我不想轉義資料，因為我使用 ckeditor（因此格式化文本），所以我使用以下措辭
{!! $treatment->description !!}
僅用于描述列。
這是我的代碼：
<table id="tabledata" class="table table-striped hover" style="width:100%">
<thead>
<tr>
<th></th>
<th>Title</th>
<th>Description</th>
<th>Stay</th>
<th>Price</th>
<th>Action</th>
</tr>
</thead>
<tbody>
@foreach ($treatments as $treatment)
<tr>
<td></td>
<td class="p-4">{{ $treatment->title }}</td>
<td class="p-4"><span class="descresize">{!! $treatment->description !!}</span></td>
<td class="p-4">{{ $treatment->duration }} </td>
<td class="p-4">{{ $treatment->price }} €</td>
<td>
<a class="btn btn-primary" href="{{route('treatment.edit', compact('treatment'))}}" role="button">Update</a>
</td>
</tr>
@endforeach
</tbody>
</table>
CSS
.descresize{
display: inline-block;
width: 500px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
你能幫幫我嗎？我要瘋了才能解決這個問題
uj5u.com熱心網友回復：
在 Laravel 的 Blade 模板引擎中，{!! !!}用于輸出未轉義的內容，包括（但不限于）HTML 標簽。當與 CKEditor 結合使用時，您通常會得到如下內容：
<span class="descresize">{!! $treatment->description !!}</span>
<!-- <span ><p>Something something long description of the associated Treatment</p></span> -->
由于 CSS 屬性被分配給<span >，現在等同于<span ><p>...</p></span>，這些屬性可能會或可能不會傳播到這些嵌套的 HTML 元素。
如果 的內容{!! $treatment->description !!}要保持一致（即始終是一個<p>...</p>元素），您可以簡單地修改 CSS 以指向這個嵌套元素：
.descresize > p {
display: inline-block;
width: 500px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
由于<p>標簽只包含文本，沒有嵌套元素，這應該正確處理屬性。
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/527096.html