怎样设置CSS背景图片？作为前端界的一项基本技能，CSS背景图片的利用颇受青睐。在这篇文章里我将介绍怎样使用CSS设置网页背景图片。使用background-image属性为了在网站的背景中放入图片，我们需要使用background-image属性。这个属性可以接受一个URL值，该值指向一张图片文件的路径。例如，在CSS中，我们可使用以下代码来援用一张叫做“background.jpg”的图片：```CSSbody{background-image:url(background.jpg);}```在上述代码中，我们将“background.jpg”作为背景图片引入到了全部页面的body元素中。使用background-repeat属性默许情况下，背景图片会自动平铺到全部页面的背景上。但是，我们有时也需要自定义图片的铺放方式。这时候候我们就能够使用background-repeat属性来控制背景图片会不会重复。background-repeat属性有以下可选值：•repeat：背景图片重复显示，以铺满全部背景•repeat-x：背景图片水平方向重复•repeat-y：背景图片垂直方向重复•no-repeat：背景图片不重复，只显示一次例如，我们希望一张用于装潢的花纹仅仅在水平方向重复，我们可以这样写：```CSSbody{background-image:url(background-flower.jpg);background-repeat:repeat-x;}```使用background-position属性background-position属性可以用来定义背景图片在页面中的位置。该属性接受一对值，第一个值表示水平方向位置，第二个值表示垂直方向位置。这对值可以采取区别的格式描写，其中最经常使用的是像素和百分数格式。例如：```CSSbody{background-image:url(background-flower.jpg);background-repeat:no-repeat;background-position:50%200px;}```在上述代码中，背景图片会在水平方向上显示在页面的中心位置（50%），同时在垂直方向上是从距离页面顶部200像素的位置开始渲染。使用background-attachment属性background-attachment属性可让背景图片与页面转动进行区别的互动。该属性有两个可选值：fixed和scroll。如果使用fixed值，取得固定在屏幕上的效果。与之相反，如果使用scroll值，则网页中转动页面时，背景图片也会随着一起转动。例如：```CSSbody{background-image:url(background-flower.jpg);background-repeat:no-repeat;background-position:50%200px;background-attachment:fixed;}```在上述代码中，花纹背景会被固定在屏幕的位置上，不随页面的转动而变化。结论随着上述设置的演示，希望你现在对怎样在网页中使用背景图片有了更好的了解。虽然这些设置只是基本的使用方式，但它们可以为你的网站作出重要贡献。

桂.哥.网.络www.guIgege.cn