css布局实现鹦鹉唱歌动画效果代码
代码语言:html
所属分类:动画
代码描述:css布局实现鹦鹉唱歌动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
@import url("https://fonts.googleapis.com/css2?family=Chilanka&display=swap");
:root {
--darkblue: #78c2e2; /* body stripe 1 */
--mediumblue: #86c8e5; /* body stripe 2 */
--mediumblue2: #81c6e4; /* body stripe 3 */
--mediumblue3: #91cde7; /* body stripe 4 */
--mediumblue4: #8acae6; /* body stripe 5 */
--lightblue: #98d0e9; /* body stripe 6 */
--mediumblue5: #70bee0; /* head */
--yellow: #f7ca72; /* around eyes, body, wing shadow */
--greybrown: #928b85; /* around eyes, wing shadow, feet */
--darkgrey: #5f617b; /* beak */
--darkishgrey: #7a798a; /* nostril */
--black: #373b63; /* eyeball */
--lightgrey: #e8eaf9; /* around eyeball */
--white: #ffffff; /* eye white */
--greyish: #e5e7f8; /* eye shadow */
--blueshadow: rgba(95, 97, 123, 0.3); /* wing shadow */
--lightyellow: #b3aeaa; /* beak end */
--lightyellow2: #aba7a8; /* beak middle */
--darkgreyish: #8c898e; /* mouth */
--darkergrey: #5f617b; /* bottom beak */
--purplegrey: #707297; /* beak top */
--anotherblue: #89c9e5; /* wing */
--anotherblue2: #90cde7; /* wing */
--anotherblue3: #70bee0; /* wing */
--lightyellow3: #f9d58e; /* body */
--onemoregrey: #e1e9f5; /* circle */
--verylightgrey: #e7edf6; /* circle */
--darkred: #8b00.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0