CSS 记录

多层渐变背景色

background: radial-gradient(circle at 50% 50%, rgba(243, 196.3, 96.5, 1) 0%,rgba(238.8, 34.6, 122.1, 0.2) 80%) 50% 50%, linear-gradient(0deg, rgba(170.2, 106.8, 238.7, 1) 0%,rgba(162.6, 112.6, 178.8, 1) 100%) 50% 50%;

 

input 光标颜色

input{
    caret-color:#ff0000;
}

 

毛玻璃质感

.container{
    background-color: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(10px);
}

样式

.footer {
    width: 65vw;
    height: 120rpx;
    bottom: 10vh;
    width: fit-content; // 内容有多少宽度就有多大
    display: flex;
    justify-content: space-around;
    align-items: center;
    background: rgba(255, 255, 255, 0.8);
    color: #000;
    border-radius: 120rpx; // 圆角
    box-shadow: 0 2rpx 0 rgba(0, 0, 0, 0.1); // 阴影
    backdrop-filter: blur(20rpx); // 模糊背景
}