css图片横向不重复平铺

CSS是网页设计中必不可少的语言之一，通过它可以实现图片的横向平铺等各种效果。本文将介绍如何使用CSS实现图片横向不重复平铺。

    .bg {
        width: 100%;
        height: 200px;
        background-image: url('background.jpg');
        background-repeat: repeat-x;
        background-size: cover;
    }

上面的代码中，首先定义了一个class为bg的样式，它的width为100%，height为200px。然后使用background-image属性指定背景图片为background.jpg，使用background-repeat属性设置图片平铺方式为repeat-x，即只横向平铺。最后使用background-size属性设置图片尺寸为cover，使得图片大小适应容器。

需要注意的是，要使用不重复的图片进行平铺，需要先将图片做成一张宽度足够的图片，然后使用CSS的background-repeat属性进行平铺。

通过上述代码设置，即可实现图片横向不重复平铺的效果，让网页更加美观且富有层次感。