CSS 的 ellipsis 是用來解決限制文字長度，過長則可以幫你在字尾加上 “...”，讓你不必費心思考怎麼處理 ... ，也不須麻煩後端做字元數量計算， 參考連結。
---
BTW: 但有個缺點就是只限制在文字只需要顯示最多一行的情況，多行的話則沒有辦法 (應該說辦法是有，只是還不能用 (以後可以期待 https://drafts.csswg.org/css-ui-4/#overflow-string)，而且解法我也認為大多是 workaround，除非等新的 css 屬性出來，所以多行擷取字元的話還是交給強大的後端吧，JS 處理顯得有些麻煩)
---
不過問題是因為我參考了網路上 sticky-footer 的做法 (參考)，因為網頁主要的 container, dispay: 是 table-row, 結果在整個網站想要使用 ellipsis 突然就沒有作用，解法是在設定 display:table 的 <body> 上 加上 table-layout: fixed 的屬性。
雖然 table-layout: fixed 這解法有點讓我不太理解 (啊...我也不曉得當初為什麼我會選擇用 table 來做 sticky-footer，大概又是趕時間的衝動 XD)，下次使用 sticky-footer 時也許可以改用其他方式 (當然還是要看瀏覽器支援的程度)。
沒有留言:
張貼留言
若你看的文章，時間太久遠的問題就別問了，因為我應該也忘了... XD