css 实现背景图片平铺效果

目的：为了更好的美化背景图片效果与页面内容

直接上代码：

div{ background-image: url(" images/bg.gif ");
    background-repeat: no-repeat;   //不重复
    background-repeat: repeat-x;
    background-size: 100% 100%;     // 满屏
}

 div{backgroud-image:url(images/bg.gif);}
 <!-- 默认repeat -->

其他平铺方式：
repeat：即默认方式，完全平铺背景；
no-repeat：在X及Y轴方向均不平铺；
repeat-x：横向平铺背景；
repeat-y：纵向平铺背景。

传统：有用渐变式背景等其他样式美化页面背景

效果图比较：
图片来源
repeat：即默认方式，完全平铺背景；

no-repeat：在X及Y轴方向均不平铺；

repeat-x：横向平铺背景；

repeat-y：纵向平铺背景。