边框渐变色+圆角

最新推荐文章于 2024-08-01 00:00:45 发布

前端小菜鸟也有人起

最新推荐文章于 2024-08-01 00:00:45 发布

阅读量450

点赞数 6

文章标签： javascript 前端 html

本文链接：https://blog.csdn.net/weixin_63730900/article/details/135358294

版权

文章介绍了如何在CSS中使用`border-radius`属性以及混合多个线性渐变创建圆角效果，同时解释了为何在某些情况下圆角可能不生效，并给出了正确的代码实现。

摘要由CSDN通过智能技术生成

这两个同时写，圆角不会生效

  li {
    width: 282px;
    height: 96px;
    margin-right: 20px;
    box-sizing: border-box;
    border: 1px solid transparent;
    background-image: linear-gradient(#fff, #fff),
        linear-gradient(to right, #8efd9f, #07cbfb);
    background-origin: border-box;
    background-clip: content-box, border-box;
    border-radius: 10px;
  }