数据库表中的备注存了很多的文字说明,但是页面展示只需要两行怎么办
有三种方法:
1.给这个div设置一个最大高度,然后给这个div设置oveflow:hidden,超出的直接不显示;
2.用js先判断字数,比如两行应该显示20个字,你就判断超过18字就进行截取,然后加上...一起显示;
3.overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
但是这个只能在webkit内核的浏览器中适用;
最后还要你自己看着权衡吧
substr 截取可以,剩下的用...表示呗!
或者用html方法css:
text-overflow:ellipsis;
white-space:nowrap;
overflow:hidden;
你意思是多余的文字就用省略号显示嘛
你看是不是 这样
<style type="text/css">
/*
/*当行文字*/
#testDIV{
width:100px;
height:50px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
border:1px solid #ddd;
}*/
/*多行文字*/
#testDIV{
border:1px solid #ddd;
width: 200px;
word-break: break-all;
text-overflow: ellipsis;
display: -webkit-box; /** 将对象作为伸缩盒子模型显示 **/
-webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/
-webkit-line-clamp: 3; /** 显示的行数 **/
overflow: hidden; /** 隐藏超出的内容 **/
}
</style>
</head>
<body>
<div id="testDIV" >
点击啦啦啦啦啦了绿绿绿啦啦啦啦啦了绿绿的哈哈哈哈哈jk道具哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈
</div>
</body>
同学您好,您可以从数据库获取到所有备注后,进行数据切片,切出您需要的那段文字再传给前台。
substring截取一下。不过你要显示完整的句子,需要自己增加数据库字段存储文章摘要信息
人才济济啊啊啊啊啊啊啊啊啊啊啊啊
或者用一个库标签,切除你想要的文字/c:if
你要展示的字段名
/c:if
/c:if
${unhandledevent.largeEventCategory.name }
/c:if
.ellipsis-2{
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
white-space: normal;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
用这个css