1.多行文本显示内容，超出打点
实现方法对比（假设字数不够时需要占位）
<html>
<head>
<style>
p { margin: 0; }
body { line-height: 1.5; }
.wrap {
font-size: 14px;
}
.desc-txt {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
height: 63px;
/* height: 4.5em; */
}
</style>
</head>
<body></body>
<div class="wrap">
<p class="desc-txt">占位符</p>
<p class="desc-txt">12月5日，由游戏行业头部媒体游戏陀螺、VR陀螺、陀螺电竞、陀螺财经主办的第四届金陀螺奖颁奖典礼于深圳举办。金陀螺奖是国内游戏业界中最为瞩目的游戏奖项之一，此次大会以“蝶变·向上的力量”为主题，聚焦游戏行业的未来趋势发展、行业创新升级、商业生态新连接等前沿领域，具有极高的代表性和权威性。此次颁奖典礼中，阅文集团根据IP定制改编手游《新斗罗大陆》荣获“年度人气IP类游戏奖”。</p>
</div>
</html>
对于设置高度，可以使用height:4.5em;的方式替代。
前提：body里有line-height:1.5;在后续的代码里未修改line-height值，
原因：当文字的fz增加时，宽度会适应三行不断增高，且不会出现截断不展示的情况（height:63px;这种固定数值的方式会出现显示截断）
2.鼠标快速划过，不触发hover事件
3.版权年份自动更新
<p>Copyright ©<script>document.write((new Date).getFullYear())</script>XX有限责任公司</p>
网友评论