卡片布局以及鼠标悬浮展示全部

界面要求

1. 不论视口大小每行显示6个元素，文字超出长显示省略号（暂定显示一行）

2. 当鼠标悬浮的时候，展示所有文字，卡片向下延展直到能够完全显示文字

先看效果图

分析

• 第一个要求我们可以用flex布局实现，css控制文字效果

• 第二个，我们可以采用外层嵌套div的方式控制，当鼠标悬浮的时候展示内层div

看一下代码实现吧

标签：clamp,flex,鼠标,卡片,悬浮,box,overflow,card,name
来源： https://www.cnblogs.com/all-smile/p/16593029.html