“我正在参加「兔了个兔」创意投稿大赛，详情请看：「兔了个兔」创意投稿大赛” 🐇
新年新气象~俺也来凑凑热闹。 🎊 🎊 🎊 2023兔年是癸卯年，希望大家前程似锦，吉星高照，财运亨通，合家欢乐，飞黄腾达，心想事成，诸事顺遂... 🎉 🎉 🎉；想到兔子，俺就能想到一首小时候的儿歌:"小白兔，白又白，爱吃萝卜和青菜，蹦蹦跳跳真可爱~"，不过，大白兔奶糖是真好吃 🥳。hhh,废话不多说，下面就进入正题啦--->俺来简单的介绍下~如何利用css绘制如下的萌嘞个兔 🐇。
实现
效果图和代码如下，嫌俺啰嗦的可以到这有需自取，就不用听我再AABB 啦~ 🤡
HTML代码
结构上还是很清晰的，都写了注释，俺就不赘述了，多说一句，就是像HTML这种代码结构一般都是根据所给UI图的图层进行搭建，也便于后期维护。
<div class="app">
<div>
<!-- 耳朵部分 -->
<div class="ear">
<div class="left_ear"></div>
<div class="right_ear"></div>
</div>
<div class="face">
<!-- 眼睛部分 -->
<div class="eye">
<div class="left_eye"></div>
<div class="right_eye"></div>
</div>
<!-- 腮红部分 -->
<div class="rouge">
<div class="left_rouge"></div>
<div class="right_rouge"></div>
</div>
<!-- 嘴巴部分 -->
<div class="mouth"></div>
<div class="mouth1"></div>
</div>
<div class="text">"钱兔无量"</div>
</div>
</div>
CSS实现的预备知识
我们在绘制萌嘞个兔的时候，可以看到兔子的脸是类似于半圆形，两只耳朵、腮红这块都是椭圆形，而眼睛啥的是圆形。
这个时候我们就得知道椭圆和圆形用css绘制的方法~It's show time! 🥳
绘制椭圆：就相当于画个长方形，然后设置border-radius属性为100%
width: 25px;
height: 50px;
border-radius: 100%;
绘制圆形：就相当于画个正方形，然后设置border-radius属性为50%
width: 50px;
height: 50px;
border-radius: 50%;
绘制包子脸的半圆：绘制一个长方形（不过这个长方形的高就只比宽的一半多一点点哦），然后，设置border-radius属性值，这可不是越大越好，拿捏 ✌这个度。
top: 45px;
width:100px;
height:60px;
// 冷白皮的兔兔~
background-color: rgb(251, 233, 233);
border-radius: 200px 200px 50px 50px ;
预备知识到位了，画萌嘞个兔岂不是信手拈来~
CSS实现
图案绘制的差不多了，接下来就是图案的位置了，face那一块就用的绝对定位，浮动才能遮住部分的耳朵，然后变成我们现在看到的样子。
一不小心兔兔变猫猫了，不过我觉着也很可爱，hhh
🎆最后，祝大家新的一年天天开心,努力都有回报~
Happy Ending~
