而不设置给其他元素 ㈡导航条背景图片填充小实例 ! DOCTYPE html html lang ="en" head
使用background-image来设置配景图片
语法：background-image：url（相对路径）；
相对路径写在哪就相对付哪个文件夹
如果配景图片大于元素，默认会显示图片的左上角
如果配景图片和元素一样大，则会将配景图片全部显示
如果配景图片小于元素巨细，则会默认将配景图片平铺以充塞元素
可以同时为一个元素指定配景颜色和配景图片，这样配景颜色将会作为配景图片的底色
一般情况下，设置配景图片时城市同时指定一个配景颜色
2.background-repeat
background-repeat用于设置配景图片的反复方法
可选值：repeat：默认值，配景图片会双标的目的反复（平铺）
no-repeat：配景图片不会反复，有多大就显示多大
repeat-x：配景图片沿程度标的目的反复
repeat-y：配景图片沿垂直标的目的反复
3.background-position
配景图片默认是贴着元素的左上角显示
通过background-position可以调解配景图片在元素中的位置
可选值：该属性可以使用top right left bottom center中的两个值来指定一个配景图片的位置
top left 左上 bottom right 右下
如果只给出一个值，则第二个值默认是center
也可以直接指定两个偏移量
第一个值是程度偏移量
- 如果指定的是一个正值，，则图片会向右移动指定的像素
- 如果指定的是一个负值，则图片会向左移动指定的像素
第二个是垂直偏移量
- 如果指定的是一个正值，则图片会向下移动指定的像素
- 如果指定的是一个负值，则图片会向上移动指定的像素
4.background-attachment
用来设置配景图片是否随页面一起滚动
可选值：scroll：默认值，配景图片跟着窗口滚动
fixed：配景图片会固定在某一个位置，不随页面滚动
不随窗口滚动的图片，我们一般都是设置给body，而不设置给其他元素
㈡导航条配景图片填充小实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>导航栏配景填充</title> <style> .box{ width: 1000px; height: 48px; background-color: #bfa; margin:70px auto; background-image: url(1.png); background-repeat: repeat-x; } </style> </head> <body> <div class="box"></div> </body> </html>
原图： 案例效果图：
温馨提示: 本文由Jm博客推荐，转载请保留链接: https://www.jmwww.net/file/web/30309.html
![[转]Node.js中package.json中^和~的区别](/uploads/allimg/200519/054J34453_lit.png "[转]Node.js中package.json中^和~的区别")