重点:text-overflow: ellipsis;
1.一行显示,内容超出后省略号表示
实现:
display: inline-block;overflow: hidden;text-overflow: ellipsis;width: 100%;white-space: nowrap;
效果:
2.三行显示,内容超出后省略号表示
实现:
overflow: hidden;text-overflow: ellipsis;width: 100%;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;word-break: break-all;
效果: