CSS实践 —— 悬浮盒子阴影加上移效果
悬浮盒子阴影加上移效果
- 代码
代码
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>Title</title><style>body{background-color: #f5f5f5;}.shadow {width: 100px;height: 100px;margin: 100px auto;background-color: #ffffff;transition: box-shadow 500ms, transform 0.5s ease-in-out;}.shadow:hover {box-shadow: 2px 2px 10px -4px rgba(0, 0, 0, 0.3);transform: translateY(-5px);}</style></head><body><div class="shadow"></div></body>
</html>