效果图
结构划分
代码文件结构
- html文件
- css文件
书写步骤：
- 背景图部分只要能够覆盖即可，对背景图所在的类名设置
background-size: cover;即可 - 如果
.usercard-body-right-text的高度设置为100%就会把button挤出名片框，此时将高度值改小一点就可以让button按钮回到名片框中了 - 注意写鼠标覆盖在某一处发生变化的时候
:hover的冒号前后都不需要空格，否则无效 - 当鼠标放上某处鼠标变成小手的方法：
cursor: pointer; - hover效果实现的时长设置：
transition: 800ms;
最终效果实现：
可以参考码上掘金代码：bilibili小名片仿写
