| 
TA的每日心情|  | 开心 2024-12-29 00:14
 | 
|---|
 签到天数: 29 天 [LV.4]偶尔看看III | 
 
| 一、准备好背景图片,背景图片有两种: 1、用小图片平铺整个背景,比如某种花纹。
 2、只用一张大图片做背景,比如节日图片。
 
 二、上传图片
 1、进入后台管理——界面——风格管理——编辑——编辑,设置图片在网站的保存目录,或者留空表示使用 static/image/common/ 目录,文件名不要冲突,如下图。
 2、将图片上传到设置的目录中。
 
 
 三、开始修改:
 1、进入后台管理——界面——风格管理——编辑——编辑——背景——页面背景
 2、填写图片名称(见下图),如果前几步没错,会在右侧显示效果。
 3、最关键的一步是设置背景参数(见下图),如果平铺背景图片直接留空,主要参数含义如下。
 A、背景重复方式:
 
 B、背景滚动方式:| repeat | 默认。背景图像将在垂直方向和水平方向重复。 |  | repeat-x | 背景图像将在水平方向重复。 |  | repeat-y | 背景图像将在垂直方向重复。 |  | no-repeat | 背景图像将仅显示一次。 | 
 
 C、背景图片X、Y点起始位置:| scroll | 默认值。背景图像会随着页面其余部分的滚动而移动。 |  | fixed | 当页面的其余部分滚动时,背景图像不会移动。 | 
 
 这里举几个例子:| top lefttop centertop rightcenter leftcenter centercenter rightbottom leftbottom centerbottom right
 | 如果您仅规定了一个关键词,那么第二个值将是"center"。 
 |  | x% y% | 左上角是 0% 0%。右下角是 100% 100%。 如果您仅规定了一个值,另一个值将是 50%。
 
 |  | xpos ypos | 左上角是 0 0。单位是像素 (0px 0px) 或任何其他的 CSS 单位。 如果您仅规定了一个值,另一个值将是50%。
 
 | 
 a、图片从左上角平铺:“repeat 0 0",因为默认值可省略,所以此时参数空白,效果也相同。
 b、图片不平铺、水平居中:“no-repeat  50% 0%"
 
 
 | 
 |