js实现一幅动态艺术画作效果代码
代码语言:html
所属分类:布局界面
代码描述:js实现一幅动态艺术画作效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
:root {
--black: #000;
--grey: #7D808A;
--white: #fff;
--clr1: #F29F05;
--clr2: #73BFAA;
--clr3: #6BB3F2;
--clr4: #5B92D9;
--clr5: #A60530;
}
*,
*::after,
*::before,
html,
body {
box-sizing: border-box;
margin: 0;
padding: 0;
}
body {
background: var(--grey);
display: grid;
height: 100vh;
place-items: center;
}
#poster {
background-color: var(--white);
border: 2vmin solid var(--black);
box-shadow: 0 4vmin 8vmin -4vmin;
box-sizing: content-box;
height: 80vmin;
padding: 4vmin;
width: 50vmin;
}
#canvas {
background: var(--black);
display: grid;
height: 80vmin;
overflow: hidden;
position: relative;
/* place-items: center; */
width: 50vmin;
}
#canvas span {
background-color: var(--black);
.........完整代码请登录后点击上方下载按钮下载查看
网友评论0