CSS文本溢出：省略號; 不工作？我不知道為什么這個簡單的CSS不起作用.......app a {
height: 18px;
width: 140px;
padding: 0;
overflow: hidden;
position: relative;
margin: 0 5px 0 5px;
text-align: center;
text-decoration: none;
text-overflow: ellipsis;
white-space: nowrap;
color: #000;}<div class="app">
<a href="">Test Test Test Test Test Test</a></div>應該在4號“測試”周圍切斷
3 回答
HUH函數
TA貢獻1836條經驗 獲得超4個贊
接受的答案很棒。但是，您仍然可以使用%寬度和達到text-overflow: ellipsis。解決方案很簡單：
display: inline-block; /* for em, a, span, etc (inline by default) */
text-overflow: ellipsis;
width: calc (80%); /* The trick is here! */
似乎只要您使用calc終值以絕對像素，這必然轉化渲染80%成類似800px的1000px-width容器。因此，而不是使用width: [YOUR PERCENT]%，使用width: calc([YOUR PERCENT]%)。
- 3 回答
- 0 關注
- 925 瀏覽
相關問題推薦
添加回答
舉報
0/150
提交
取消