找回密码
 点击这里加入

QQ登录

只需一步,快速开始

搜索
热搜: 资料 加点
查看: 2173|回复: 4

DZ修改背景,让图片布满整个网页背景

[复制链接]
  • TA的每日心情
    开心
    2024-12-15 11:29
  • 签到天数: 28 天

    [LV.4]偶尔看看III

    发表于 2021-4-2 15:24:50 | 显示全部楼层 |阅读模式
    一、准备好背景图片,背景图片有两种:
    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%"

    您需要登录后才可以回帖 登录 | 点击这里加入

    本版积分规则

    QQ|Archiver|手机版|小黑屋|龙魂有你更精彩 YY频道:51921 ( 蒙ICP备2024020153号 )

    GMT+8, 2024-12-26 20:29 , Processed in 0.081426 second(s), 23 queries .

    Powered by Discuz! X3.5

    © 2001-2024 Discuz! Team.

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