html背景图片如何自动平铺,html怎么设置背景图片全屏平铺？

大家好，又见面了，我是你们的朋友全栈君。

6987fdbdbdc7610e4430c572ce89de62.png

html怎么设置背景图片全屏平铺？

1、新建一个html文档。

149709f940371469a21b495719bade93.png

2、设置一下HTML的框架，然后把图片设置在同一个文件夹里面。

2ae4c80aef3d9ceac23199e8fc85bfb4.png

09fdc1fd52104e33c7828ea791a821e2.png

3、加入，这样可以有样式设置。

c7759ed361930370ae2aeeb69698053c.png

4、因为背景设置在主体，所以还要定义为body{}。

3e066c8e53f93bb370f6b77a6c3f74ce.png

5、background-image:url(图片)，这个是添加图片的意思。

6dca21e76595bb5308e614aa3b352303.png

73530e63636716c1066f9c16438d8d3f.png

6、然后我们需要加入background-repeat:repeat-x;这个时候就会横向平铺。

d21090e73a0c9f9b958692f21f903ee3.png

2a4a5695c64af32b66e827abda320bc5.png

7、background-repeat:no-repeat;这样就可以不重复平铺。

31685c257aa5d92c0dba351897576b3a.png

7877a0a0efb798165fd07ff6de10792a.png

8、background-repeat:repeat-y;这个指令是纵向平铺。

a53cf1868b36c5d0a599b9fbd5fd2904.png

6744a34b7995bc610e2120852e82d282.png

9、background-repeat:repeat;这样则是全屏平铺。

30a386d142416c4397defc77ede72bc9.png

045e1e2873aa2ce4d74e92bf8de419f1.png

发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn/146226.html原文链接：https://javaforall.cn