Discuz!官方免费开源建站系统

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索

新手小技巧之一:x2.5修改背景,让图片布满整个网页背景

[复制链接]
poleaf 发表于 2012-8-26 11:05:21 | 显示全部楼层 |阅读模式
我也是个新手,制作模板的过程中,往往为了一个小问题花费大量时间,在这里与大家分享我的制作小经验,给大家省点精力。
1、善用教程:DZ有很多教程,新手花点时间看看再动手,反而能省很多时间,除DZ论坛外,再推荐一个http://www.discuzt.com/。
2、善用搜索:新手有问题,先到论坛中搜索一下,很多好心人都有解答。

今天分享修改背景的方法:
一、准备好背景图片,背景图片有两种:
1、用小图片平铺整个背景,比如某种花纹。
2、只用一张大图片做背景,比如节日图片。

二、上传图片
1、进入后台管理——界面——风格管理——编辑——编辑,设置图片在网站的保存目录,或者留空表示使用 static/image/common/ 目录,文件名不要冲突,如下图。
2、将图片上传到设置的目录中。


三、开始修改:
1、进入后台管理——界面——风格管理——编辑——编辑——背景——页面背景
2、填写图片名称(见下图),如果前几步没错,会在右侧显示效果。
3、最关键的一步是设置背景参数(见下图),如果平铺背景图片直接留空,主要参数含义如下。
A、背景重复方式:
repeat默认。背景图像将在垂直方向和水平方向重复。
repeat-x背景图像将在水平方向重复。
repeat-y背景图像将在垂直方向重复。
no-repeat背景图像将仅显示一次。
B、背景滚动方式:
scroll默认值。背景图像会随着页面其余部分的滚动而移动。
fixed当页面的其余部分滚动时,背景图像不会移动。
C、背景图片X、Y点起始位置:
  • top left
  • top center
  • top right
  • center left
  • center center
  • center right
  • bottom left
  • bottom center
  • bottom 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%"



总之,作为新手遇到问题多思考、多试几次,可以学到不少东西。

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

x

评分

1

查看全部评分

飞浪之歌 发表于 2012-9-3 15:30:56 | 显示全部楼层
如果用一张图片,多大的合适啊?急呢
回复

使用道具 举报

yuanxf168 发表于 2012-9-7 16:14:56 | 显示全部楼层
我照你的方法修改完后,即使更新了缓存,背景仍然显示不了,为什么?
谢谢!
回复

使用道具 举报

我是厦门人 发表于 2012-9-26 23:43:57 | 显示全部楼层
www.lifeaaz.com  AA生活网 路过!
回复

使用道具 举报

cpp2012001 发表于 2012-10-12 10:05:28 | 显示全部楼层
多大的合适啊?
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|小黑屋|Discuz! 官方站 ( 皖ICP备16010102号 )star

GMT+8, 2024-11-15 01:40 , Processed in 0.027567 second(s), 6 queries , Gzip On, Redis On.

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.

快速回复 返回顶部 返回列表