CSS的简写形式合集

注：| 符号为空格！

font：italic（font-style:字体倾斜样式）|small-caps（font-variant:小型大写字母）|bold（font-weight：字体粗细）|12px（font-size：字体大小）/1.5em（line-height：行高）|arial，verdana（font-family：字体）;

例：

完整写法：font：italic small-caps bold 12px/1.5em arial,verdana;

简单写法：font: 12px arial,verdana; [字体大小必须在前面！]

简写形式必须要有font-size和font-family两个属性，其他的可以不写，他们会自动使用默认值，且font-size和line-height同时存在的时候用“/”分隔开！

background: #333(background-color：背景颜色)|url(XXX.JPG)[background-image：背景图片]|no-repeat（background-repeat：重复图像）|fixed（background-attachment：图片是否固定）|0（background-position：图片的位置）/contain（background-size：图片大小）|border-box（background-origin：图片延伸到的范围）|border-box（background-clip：背景图片裁剪的范围）；

完整写法：background: #333 url(xxx.jpg) no-repeat fixed 0/contain border-box border-box;

简单写法：

1. background: #333 url(xxx.jpg) no-repeat fixed 0/cover;
2. background: #333 url(xxx.jpg) no-repeat;

在设置背景图片位置和大小的时候，中间用“/”符号隔开！

animation：XXX（animation-name：动画名称）|.3s（animation-duration：动画的完成时间）|ease-out（animation-timing-function：动画的缓动效果，和transform的transition一样！）|1s（animation-delay：动画延时开始的时间）|infinite（animation-iteration-count：设置动画的循环次数，直接写次数或者infinite无限次）|alternate（animation-direction：是否应该轮流反向播放动画）；

完整写法：animation: xxx .3s ease-in 0s 5 normal;

简单写法：animation: xxx .3s;