CSS动态虚线边框

.gradient {

background: linear-gradient(90deg, rgb(250, 46, 46) 50%, transparent 0) repeat-x, linear-gradient(90deg, rgb(250, 46, 46) 50%, transparent 0) repeat-x, linear-gradient(0deg, rgb(250, 46, 46) 50%, transparent 0) repeat-y, linear-gradient(0deg, rgb(250, 46, 46) 50%, transparent 0) repeat-y;

background-size: 4px 1px, 4px 1px, 1px 4px, 1px 4px;

background-position: 0 0, 0 100%, 0 0, 100% 0;

cursor: pointer;

-webkit-animation: linearGradientMove 0.3s infinite linear;

animation: linearGradientMove 0.3s infinite linear;

}

@-webkit-keyframes linearGradientMove {

100% {

background-position: 4px 0, -4px 100%, 0 -4px, 100% 4px;

}

}

@keyframes linearGradientMove {

100% {

background-position: 4px 0, -4px 100%, 0 -4px, 100% 4px;

}

}

相关推荐
一拳不是超人19 小时前
DeepSeek Harness 为什么敢说"一切皆插件"?拆透 Cordis 引擎的五大核心机制
前端·人工智能·agent
IT_陈寒19 小时前
Python的GIL让我多写了500行代码
前端·人工智能·后端
风骏时光牛马19 小时前
AI智能体能力调度微服务
前端
Eloudy21 小时前
ReAct 原理简介
前端·javascript·人工智能·react.js·agent·gpu
ZJU_统一阿萨姆1 天前
【DSH】如何将 DeepSeek Harness 嵌入生产环境?万字解构 DeepSeek Agent Harness 的运行机制与安全边界
前端·javascript·安全
用户921080262861 天前
4. 前端地图大量点位实时更新优化:后端推增量,前端做 diff
前端
SoaringHeart1 天前
Flutter最佳实践:Web项目中文字体首次加载乱码问题解决
前端·flutter
西安小哥1 天前
破局与重生:大厂前端如何借力 AI 转型“超级全栈“
前端·人工智能
sunly_1 天前
TypeScript总结:16、面向对象速查
前端·javascript·typescript
MXN_小南学前端1 天前
React超长文本域中实现“返回顶部”浮动按钮
前端·javascript·react.js