怎么用css把背景图片拉伸 不是平铺

html-css024

怎么用css把背景图片拉伸 不是平铺,第1张

1、首先准备一张设置为背景的图片,这边准备的是一张650px*347px的图片。

2、然后建立一个html文档,将它和背景图片放到一个文件夹中。

3、编辑html文档,这边建立一个div,设置宽度为700px,高度跟背景图一样,为347px。

4、就给div设置背景图片。

5、在浏览器中预览会发现图片平铺了,这不是想要的效果。

6、然后可以给div再加上属性,-moz-background-size:100% 100%background-size:100% 100%。

7、这样设置后就会发现背景图片拉伸至100%了。

background:url(../../config/img/Title.png) no-repeat不重复

background:url(../../config/img/Title.png) repeat-x横向平铺

background:url(../../config/img/Title.png) repeat-y竖着铺

什么不加就是横竖平铺

如果你是想拉伸的话,竖着切一张几个像素宽的背景图(比如说宽2px,高990px这样的一张图),然后设置repeat-x,横向平铺。这样看起来就像是一张大图。这种方法适用于纵向渐变的背景。

看不到你放的图片。被拉伸的图片一般是你设置了他的width或height

没有设置的话。他是按图片原始的大小展示的。

你仔细看看你在什么地方设置了。

还有你上传的图片我看不到。