css绘制一只公鸡剪纸效果代码
代码语言:html
所属分类:布局界面
代码描述:css绘制一只公鸡剪纸效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
html{
box-sizing: border-box ;
--cream: #f2eee3 ;
--black: #1b1b1b ;
--red: #d91729 ;
}
html *,
html *::before,
html *::after {
box-sizing: inherit ;
}
*::before,
*::after{
content: "" ;
position: absolute ;
}
body{
margin: 0 ;
width: 100% ;
height: 100vh ;
display: flex ;
overflow: hidden ;
position: relative ;
align-items: center ;
justify-content: center ;
background-color: var(--cream) ;
--beak-t: 115% 37% ;
--beak-b: 115% 41.5% ;
}
.bird{
width: 36em ;
height: 36em ;
position: relative ;
}
.bird *{
position: absolute ;
}
.head{
left: 20.1em ;
top: 7.2em;
height: 7em ;
width: 7.7em ;
border-radius: 86.2% 0 0 0;
border-top: .15em solid var(--black) ;
border-left: .15em solid var(--black) ;
.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0