美文网首页
css 画一个圆有四种颜色

css 画一个圆有四种颜色

作者: 蜗牛的学习方法 | 来源:发表于2023-07-27 16:04 被阅读0次
    image.png

    直接上代码

    <!DOCTYPE html>
    <html lang="en">
    
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Document</title>
      <style>
        .box {
          width: 100px;
          height: 100px;
          margin: auto;
          background-repeat: no-repeat;
          background-size: 50% 50%, 50% 50%;
          background-position: 0 0, 100% 0, 100% 100%, 0 100%;
          background-image: linear-gradient(#19d4ae, #19d4ae), linear-gradient(#5ab1ef, #5ab1ef), linear-gradient(#fa6e86, #fa6e86), linear-gradient(#ffb980, #ffb980);
        }
      </style>
    </head>
    
    <body>
      <div class="box"></div>
    </body>
    
    </html>
    

    相关文章

      网友评论

          本文标题:css 画一个圆有四种颜色

          本文链接:https://www.haomeiwen.com/subject/yholpdtx.html