142-平台UI优化

参考大佬文章：142
143
144
145
146
147

142–渐变色

在style中：

background:linear-gradient(方向,开始颜色,中间过渡颜色,结束颜色)

143–动态背景色

在head中：

<style>
   .wqrf_back{
      background-image: linear-gradient(50deg, #ffcde8,white, #a5e5ff);
      background-size: 200%;
      animation: animate_bg 3s infinite;
  }
  @keyframes animate_bg {
      0%, 100% {
          background-position: 0%, 50%;
      }
      50% {
          background-position: 100%, 50%;
      }
  }
</style>

144–接口库

顶部菜单、按钮的颜色修改

145–动态彩色边框

动态彩色边框：
在head的style标签中新建css样式：
（注意box前面的点.）

.box::before {
    content: '';
    border-radius: 5px;
    position: absolute;
    width: calc(100%);
    height: calc(100%);
    z-index: -1;
    background-image: linear-gradient(50deg, aquamarine, cornflowerblue, goldenrod, hotpink, salmon, lightgreen, sandybrown, violet);
    background-size: 300%;
    animation: animate_bg 4s infinite;
    }
    @keyframes animate_bg {
        0%, 100% {
            background-position: 0%, 50%;
        }
        50% {
            background-position: 100%, 50%;
        }
    }

使用：两个div嵌套使用，将外层div的class属性设为box，内部div或其他标签变白或半透明背景色

146–用例库、项目设置

按钮、背景色：

147–全局变量

调整布局：