元宵节到了，用css怎么画可爱的元宵，再配上动画呢？

用Html标签和css画元宵节卡通汤圆并且将它制作成了gif动画。两个圆滚滚可爱的小汤圆，各伸出一只小手，拉开了一个横幅“元宵快乐”。

一、整体居中

写html之前，我先将整体布局在一个div里面，设置大小为1200*500像素大小的长方形，并且居中显示。

position 属性规定元素的定位类型。一般常用到的定位有绝对定位absolute，相对定位relative。要让整个文档内容水平居中，垂直居中，那么只需要对该元素设置左边和上面的距离位置，以百分比为单位就是50%。

先看默认的显示位置，为了区分，我将背景颜色设置为白色，这个白色默认的位置在左上。

接下来用到绝对定位position: absolute;距左边和上面的距离是50%，用left: 50%;top: 50%;最后减去元素的高宽的一半就可以了。