文字渐变，边框渐变且有圆角

小白前进之路

已于 2022-10-30 00:58:07 修改

阅读量83

点赞数

分类专栏：样式文章标签： css

于 2022-10-29 00:59:05 首次发布

本文链接：https://blog.csdn.net/qq_46595660/article/details/127581870

版权

样式专栏收录该内容

4 篇文章 0 订阅

订阅专栏

文字渐变

 background: -webkit-linear-gradient(270deg, #F23B3F 0%, #E55074 94%);
 -webkit-background-clip text
 -webkit-text-fill-color transparent

边框渐变且有圆角

  border: solid 2px transparent;
  border-radius: 14px;   
  //第一个背景色是容器的背景色，第二个背景色是容器边框的渐变色
  background-image: linear-gradient(90deg, #315AE8 0%, #72A2E4 100%, #D8264A 100%);,linear-gradient(270deg, #F23B3F 0%, #E55074 94%);    
  background-origin: border-box;    
  background-clip: content-box, border-box;