css小企鹅怎么画

CSS小企鹅该如何画呢？其实很简单，只需要几行代码就能完成。

/* 设置画布大小 */.canvas {
    width: 200px;
    height: 200px;
}
/* 绘制小企鹅身体 */.body {
    width: 120px;
    height: 100px;
    border-radius: 60px 60px 20px 20px;
    background-color: #E7EFFB;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-60px);
    z-index: 1;
}
/* 绘制小企鹅的胸部 */.belly {
    width: 80px;
    height: 60px;
    background-color: #FFFFFF;
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-40px);
    z-index: 2;
}
/* 绘制小企鹅的头部 */.head {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background-color: #E7EFFB;
    position: absolute;
    bottom: 100px;
    left: 50%;
    transform: translateX(-35px);
    z-index: 3;
}
/* 绘制小企鹅的眼睛 */.eye {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: #3B3B3B;
    position: absolute;
    bottom: 130px;
    left: 50%;
}
/* 绘制小企鹅的嘴巴 */.mouth {
    width: 40px;
    height: 20px;
    border-radius: 0 0 30px 30px;
    border-top: 3px solid #3B3B3B;
    position: absolute;
    bottom: 120px;
    left: 50%;
    transform: translateX(-20px);
}
    

只需要按照上述代码添加到你的CSS文件中并在HTML文件中使用相应的类名即可绘制出一个可爱的小企鹅。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！