<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>文本过长以省略号的形式显示</title>
<script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script>
<style>
#one{
border: dashed 1px rgb(218,22,111);
width: 150px;
height: 40px;
/*设置行高与div高度一致,垂直对齐*/
line-height: 40px;
/*设置文本不换行*/
white-space: nowrap;
/*超出长度的文本以省略号的形式显现*/
text-overflow: ellipsis;
/*文本溢出发生的事件*/
overflow: hidden;
}
</style>
</head>
<body>
<div id="one">缘来缘去终会散，花开花败总归尘！</div>
<script type="application/javascript">
//自启动方法
$(function(){
var result = "缘来缘去终会散，花开花败总归尘！";
//设置title属性，让鼠标放上去显示的文本
$("#one").attr("title",result);
});
</script>
</body>
</html>
08-11
233
233
11-11
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
