canvas实现方块艺术画作效果代码
代码语言:html
所属分类:布局界面
代码描述:canvas实现方块艺术画作效果代码,点击可更换新的画作
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> :root { --black: #000; --grey: #7D808A; --white: #fff; --clr1: #b8eafd; --clr2: #6BB3F2; --clr3: #3c8ad3; --clr4: #42b3ff; --clr5: #004d91; --clr6: #003380; } *, *::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; display: grid; height: 80vmin; padding: 4vmin; place-items: center; width: 50vmin; } #canvas { background: var(--black); height: 80vmin; overflow: hidden; position: relative; width: 50vmin; } #canvas * { left: 0; position: absolute; top: 0; transition: .3s linear; } </style> </head> <body> <script> let body,.........完整代码请登录后点击上方下载按钮下载查看
网友评论0