文字溢出显示点点点
一段很長文字在頁面縮放顯示的時候會溢出，很多時候都是設置為溢出顯示點點點。
溢出顯示一行文字點點點，代碼如下：
<!DOCTYPE html> <html><head><meta charset="utf-8"><title>溢出顯示點點點</title><style type="text/css">.dv{width:300px;height:150px;padding: 10px;border: 1px solid #ccc;/* 強制不換行 */white-space: nowrap;/* 文字的超出部分用省略號代替 */text-overflow: ellipsis;/* 隱藏溢出內容 */overflow: hidden; }</style></head><body><div class="dv">這是一段超長的文字超長的文字，這是一段超長的文字真的超長超長超長的。這是一段超長的文字超長的文字，這是一段超長的文字真的超長超長超長的。</div></body> </html>效果圖如下：
?如果一段文字想要設置兩行顯示，超出部分點點點，代碼如下：
display: -webkit-box; word-break: break-all; text-overflow: ellipsis; overflow: hidden; white-space: pre-line; -webkit-box-orient: vertical; -webkit-line-clamp: 2;效果圖如下：
echarts圖的x軸設置文字兩行顯示，溢出部分顯示點點點，代碼如下：
// xAxis axisLabel: {interval: 0,//多出字可以省略顯示成點formatter: function (val) {var strs = val.split(""); //字符串數組var str = "";for (var i = 0, s; (s = strs[i++]); ) {if (i < 8) {if (i >= 7 && strs.length > 8) {str += "...";} else {//遍歷字符串數組str += s;}if (!(i % 4)) str += "\n"; //按需要求余}}return str;},textStyle: {fontSize: "10px", //x軸的字體大小color: "#000",},},element ui組件，el-table的顯示點點點出現tips代碼：
:show-overflow-tooltip="true"
總結
- 上一篇： macOS Command - soft
- 下一篇： java的流间隔问题_java –