纯css实现滚动浏览器实现变色效果

代码语言:html

所属分类:加载滚动

代码描述:纯css实现滚动浏览器实现变色效果

代码标签: 滚动 浏览器 实现 变色 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开


<!DOCTYPE html>
<html lang="en">
<head>

<style>
article {
  background: conic-gradient(
    hsl(100 100% 60%), 
    hsl(200 100% 60%), 
    hsl(100 100% 60%) 
  ) fixed;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-align: center;
} 

body {
  background: hsl(204 100% 5%);
/*   background: conic-gradient(
    hsl(100 100% 60%), 
    hsl(200 100% 60%),
    hsl(100 100% 60%)
  ) fixed; */
  color: white;
  min-block-size: 200vh;
  min-inline-size: 100%;
  padding: 5vmin;
  box-sizing: border-box;
  display: grid;
  place-content: center;
  font-family: system-ui;
  font-size: min(200%, 5vmin);.........完整代码请登录后点击上方下载按钮下载查看

网友评论0