CSS 圆角渐变边框

html 复制代码
 <div class="contact-box">
    <div class="contact-item">联系我们</div>
</div>
css 复制代码
    .contact-item{
      width: 194px;
      height: 48px;
      border-radius: 20px 20px 20px 20px;
      background-color: #000000;
      color: #BDBDBD;
      font-weight: 500;
      font-size: 16px;
      text-align: center;
      line-height: 48px;
      cursor: pointer;
    }
    border: 1px solid;
    width: 194px;
    height: 48px;
    background: linear-gradient(90deg, rgba(202, 217, 255, 1), rgba(218, 218, 218, 1), rgba(255, 144, 71, 1));
    border-radius: 20px 20px 20px 20px;
    padding: 1px;/* 边框宽度 */

  }
相关推荐
万物得其道者成2 分钟前
用 Python + MySQL + Web 打造我的私有 Apple 设备监控面板
前端·python·mysql
Hi_kenyon12 分钟前
快速入门VUE与JS(二)--getter函数(取值器)与setter(存值器)
前端·javascript·vue.js
海云前端115 分钟前
前端面试加分技巧:文本省略 + Tooltip 优雅实现,附可直接复用代码(求职党必看)
前端
3秒一个大16 分钟前
模块化 CSS:解决样式污染的前端工程化方案
css·vue.js·react.js
在西安放羊的牛油果16 分钟前
浅谈 storeToRefs
前端·typescript·vuex
triumph_passion16 分钟前
Zustand 从入门到精通:我的工程实践笔记
前端·性能优化
pusheng202517 分钟前
双气联防技术在下一代储能系统安全预警中的应用
前端·安全
C_心欲无痕17 分钟前
ts - 交叉类型
前端·git·typescript
彭涛36118 分钟前
Blog-SSR 系统操作手册(v1.0.0)
前端
全栈前端老曹24 分钟前
【前端路由】React Router 权限路由控制 - 登录验证、私有路由封装、高阶组件实现路由守卫
前端·javascript·react.js·前端框架·react-router·前端路由·权限路由