css布局实现飞鸟效果
代码语言:html
所属分类:布局界面
代码描述:css布局实现飞鸟效果
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
html, body {
--background: #f2f4ff;
background: var(--background);
}
.cartoon {
--size: 30vmin;
--primary: #acf;
--primary-semi: #9be4;
--secondary: #bbe;
--secondary-semi: #aad4;
--shadow: #8ad4;
position: absolute;
width: var(--size);
height: var(--size);
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.cartoon div {
position: absolute;
}
.b {
border: 1vmin solid black;
}
.r {
border-radius: 100%;
}
.hb::before,
.ha::after.........完整代码请登录后点击上方下载按钮下载查看
网友评论0