div+css实现2022到2023点击切换代码
代码语言:html
所属分类:其他
代码描述:div+css实现2022到2023点击切换代码
代码标签: div css 2022 2023 点击 切换 代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> input { display: grid; padding: 10px; filter: blur(4px) contrast(20) hue-rotate(53deg); background: #fff; mix-blend-mode: darken; -webkit-appearance: none; -moz-appearance: none; appearance: none; } input:before { content:""; width: 300px; /* control the size */ aspect-ratio: 3; cursor: pointer; transition: .5s; background: linear-gradient(60deg,#f0f 49%,#0ff 51%) calc(100% - var(--p,0%))/240% 100%; --g:/calc(400%/15) 20% repeat-x linear-gradient(90deg,#000 75%,#0000 0); -webkit-mask: linear-gradient(#000 0 0) var(--p,calc(600%/7)) 75%/calc(100%/15) 20% no-repeat, 0 0 var(--g),0 100% var(--g),0 50% var(--g), linear-gradient(90deg,#0000 50%,#000 0 75%,#0000 .........完整代码请登录后点击上方下载按钮下载查看
网友评论0