css：transition tab切换 动态滑动效果 |
您所在的位置：网站首页 › tab滑动切换特效 › css：transition tab切换 动态滑动效果 |
|
css：transition tab切换 动态滑动效果
原创
微笑@鼠 2023-01-14 02:01:24 博主文章分类：css ©著作权 文章标签 前端 css Powered by 金山文档 文章分类 虚拟化 云计算 ©著作权归作者所有：来自51CTO博客作者微笑@鼠的原创作品，请联系作者获取转载授权，否则将追究法律责任 item1 item2 export default { data() { return { active:1 } }, }.tabs{ width: 500rpx; height: 100rpx; margin: auto; display: flex; align-items: center; justify-content: center; position: relative; .item{ text-align: center; width: 250rpx; height: 100rpx; line-height: 100rpx; border: 1px solid #26A69A; position: relative; z-index: 2; } .active{ color: #fff; } .bgs{ position: absolute; left: 0; top: 0; z-index: 1; width: 250rpx; height: 100rpx; background: #26A69A; transition: all .5s; } .left1{ left: 250rpx; }} 赞 收藏 评论 分享 举报上一篇：纯css加载动画效果 |
| CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |