HTML
全局代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<style type="text/css">
.mainControl{
font-family: 'Helvetica Neue',Helvetica,'Lucida Grande',Arial,'Hiragino Sans GB','\5FAE\8F6F\96C5\9ED1','WenQuanYi Micro Hei',STHeiti,SimSun,sans-serif;
font-size: 12px;
left: 0;
right: 0;
text-align: center;
}
.myCR{
border-radius: 12px;
padding: 3px 11px;
border: 1px solid transparent;
background-image: -webkit-gradient(linear,left top,left bottom,from(#fff),to(#fff)),-webkit-gradient(linear,right top,left top,from(#70db96),color-stop(#66beb3),color-stop(#759bec),color-stop(#a277c8),color-stop(#f56a62),color-stop(#f9ac5e),to(#fdde5d));
background-image: -o-linear-gradient(#fff,#fff),-o-linear-gradient(right,#70db96,#66beb3,#759bec,#a277c8,#f56a62,#f9ac5e,#fdde5d);
background-image: linear-gradient(#fff,#fff),linear-gradient(270deg,#70db96,#66beb3,#759bec,#a277c8,#f56a62,#f9ac5e,#fdde5d);
background-origin: border-box;
background-clip: padding-box,border-box;
}
</style>
</head>
<body>
<div class="mainControl">
<span class="myCR">
© <script type="text/javascript">document.write((new Date()).getFullYear());</script> 何星星 保留所有权利
</span>
</div>
</body>
</html>CSS
核心代码
border-radius: 12px;
padding: 3px 11px;
border: 1px solid transparent;
background-image: -webkit-gradient(linear,left top,left bottom,from(#fff),to(#fff)),-webkit-gradient(linear,right top,left top,from(#70db96),color-stop(#66beb3),color-stop(#759bec),color-stop(#a277c8),color-stop(#f56a62),color-stop(#f9ac5e),to(#fdde5d));
background-image: -o-linear-gradient(#fff,#fff),-o-linear-gradient(right,#70db96,#66beb3,#759bec,#a277c8,#f56a62,#f9ac5e,#fdde5d);
background-image: linear-gradient(#fff,#fff),linear-gradient(270deg,#70db96,#66beb3,#759bec,#a277c8,#f56a62,#f9ac5e,#fdde5d);
background-origin: border-box;
background-clip: padding-box,border-box;Demo
https://static.hexingxing.cn/v3/css/rainbow_borders/
友情提示：本站所有文章，如无特殊说明或标注，均为何星星原创发布。与此同时，趋于近年来本站的文章内容频繁被他站盗用与机器采集，现已全局禁用网站文字内容操作，了解详情或转载文章请 点此 继续！
1 条评论
Sm · 2023年11月25日 17:07
(๑•̀ㅂ•́)و✧