关于在HTML网页制作中如何添加背景图片
在网页制作中,添加背景图片需使用background-image:url(),其路径需相对于CSS文件位置。常用属性包括:background-repeat:no-repeat控制不重复;background-position:center控制居中;background-attachment:fixed实现固定效果;background-size可设置cov
在网页制作中,给页面添加背景图片,可以说是最基础但又最容易出细节的操作之一。很多新手会在路径引用上栽跟头,或者搞不清重复、居中这些属性怎么配合。今天就来聊聊 background-image 这个属性,顺便把几个常见用法理清楚。
效果图:

先看核心语法:background-image:url(图片地址);。这里的 url 可以是网络上的一张图片链接,也可以是本地保存的图片文件。但要注意——如果是本地图片,路径是相对于 CSS 文件的存放位置来写的。最简单的做法是,直接把图片和 CSS 文件放在同一个文件夹里,然后直接写 url(图片名称.jpg) 就行,省心又不容易出错。
放置方法示例:

代码引用:

其他几个常用属性,顺手也提一下:
background-repeat: no-repeat;——背景图片不重复,默认是重复平铺的,加了这个就只显示一张。
background-position: center;——让背景图片居中显示,你也可以改成 top、bottom、left、right,或者用具体的像素值。
background-attachment: fixed;——固定背景图片,页面滚动时背景不动,适合做视觉差效果。










































