div+css布局实现哆啦A梦眼球转动动画效果代码
代码语言:html
所属分类:动画
代码描述:div+css布局实现哆啦A梦眼球转动动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> body { margin: 0; } .body { background-color: #199bb5; width: 10vw; height: 9vw; position: absolute; top: 13vw; left: 2.5vw; } .helicopter { height: 100px; weight: 1px; border-left: 1px solid yellow; position: absolute; } .head { border-radius: 50%; background-color: #199bb5; width: 15vw; height: 14vw; position: absolute; top: 15vw; left: 45vw; } .tummy { border-radius: 90%; background-color: white; width: 8vw; height: 6vw; position: absolute; top: 2.3vw; left: 1vw; border: 0.5px solid black; } .tummy_pocket { border-radius: 50%; background-color: whitesmoke; width: 5vw; height: 4.5vw; position: absolute; border: 0.5px solid black; top: 0.6vw; left: 1.4vw; } .tummy_pocket_margin { background-color: white; border-bottom: 0.5px solid black; width: 5.1vw; height: 1.5vw; position: absolute; top: 0vw; left: 0vw; } .face { height: 11vw; width: 12vw; background-color: whitesmoke; border-radius: 48%; position: absolute; top: -7vw; left: -1.6vw; } .eye1 { height: 3vw; width: 2.4vw; background-color: white; border: 1px solid black; border-radius: 48%; position: absolute; top: -1vw; left: 3.5vw; } .eye2 { height: 3vw; wi.........完整代码请登录后点击上方下载按钮下载查看
网友评论0