<html><head><meta charset="UTF-8"><title>用 css 实现字符串截断</title><style>div { width: 300px; overflow: hidden; /规定当内容溢出元素框时发生的事情/ white-space: nowrap; /设置如何处理元素内的空缺。规定在文本中不进行换行/ text-overflow: ellipsis; /规定当文本溢出包含元素时发生的事情/}div:hover{ cursor:pointer;}div:hover:before{ content:attr(title); background:#d9444a; color:#fff; padding:.8em 1em; position:absolute; left:100%; top:-70%; margin-left:14px; white-spack:pre;}div:hover:after{ content:" "; position:absolute; left:80%; width:0; height:0; border-right:8px solid #d9444a; border-top:8px solid transpatrnt; border-bottom:8px solid transparent;}</style></head><body><div title="轻轻松松制作div+css截取字符段在规定长度，超出部分用...代替！
">轻轻松松制作div+css截取字符段在规定长度，超出部分用...代替！
</div></body></html>
