纯CSS代码加上<div>制作动画版哆啦A梦（机器猫）
哆啦A梦（机器猫）我们大家一定都很熟悉，今天给大家演示怎么用纯CSS。代码，来做一个动画版的哆啦A梦.
效果图：
###下面代码同学可以查看一下，每个线条及椭圆都是纯CSS代码生成。
首先分析结构
根据原图，将哆啦A梦分为几个结构，然后再分解其他部位。
- 画出各部分的形状和颜色，然后使用绝对定位（absolute）和相对定位（relative）改变其位置。
- 各种带弧度形状，使用border-radius属性实现。
- 倾斜角度，使用transform属性实现。
使用background属性的-webkit-gradient() / -moz-linear-gradient() 画出身体部分的线性色彩变化。
html代码如下：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>哆啦A梦（机器猫）动画版</title> </head> <body> <!-- content是整个哆啦A梦的主体 --> <div class="content"> <!-- 哆啦A梦的头部 --> <div class="head"></div> <!-- 哆啦A梦的脸部 --> <div class="face"> </div> <div class="eye"> <div></div> <div></div> </div> <div class="eye-2"> <div> <div></div> </div> <div> <div></div> </div> </div> <!-- 哆啦A梦的鼻子 --> <div class="nose"> <div class="nose-2"></div> <div class="nose-3"></div> </div> <!-- 哆啦A梦的胡子 --> <div class="huzi"> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> </div> <div class="huzi2"> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> </div> <!-- 哆啦A梦围巾 --> <div class="weijin"></div> </div> </body> </html>css代码如下：
```
####哆啦A梦完整HTML+CSS代码如下：<!DOCTYPE html>