div+css布局实现可爱小乌龟动画代码
代码语言:html
所属分类:布局界面
代码描述:div+css布局实现可爱小乌龟动画代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> @property --x { syntax: '<percentage>'; initial-value: 40%; inherits: true; } body { overflow: hidden;} #turtle { --skin: #ac6; --skin-dark: #5a3; --shell: #c52; --body: #fd5; --lines: #fa2; --x: 45%; position: absolute; width: 500px; height: 500px; bottom: 0; left: 50%; translate: -50%; animation: dance 1s alternate infinite; background: /* abs */ linear-gradient(var(--lines) 0 0) 50% 55% / 4px 250px, linear-gradient(var(--lines) 0 0) 50% 45% / 150px 4px, linear-gradient(var(--lines) 0 0) 50% 55% / 200px 4px, linear-gradient(var(--lines).........完整代码请登录后点击上方下载按钮下载查看
网友评论0