HTML网页设计——网页背景图片

 时间:2026-04-21 20:34:00

1、首先编写一个html的基本框架

HTML网页设计——网页背景图片

2、在头部<head>……</head>中加入插入背景图片的代码。

不设置平铺方式的情况下是默认水平竖直都平铺,保存为html后缀,效果如下

HTML网页设计——网页背景图片

HTML网页设计——网页背景图片

3、若要不重复平铺,需要写入

“

background-repeat: no-repeat

”此时,图片只显示一次

HTML网页设计——网页背景图片

HTML网页设计——网页背景图片

4、若要水平重复平铺,需要写入

“

background-repeat: repeat-x

”

(当左右拉动滚条时会显示)

HTML网页设计——网页背景图片

5、若要竖直重复平铺,需要写入

“

background-repeat: repeat-y

”

(当上下拉动滚条时会看到图片排列从上到下)

HTML网页设计——网页背景图片

6、若要水平竖直都重复平铺,需要写入

“

background-repeat: repeat

”

(当出现上下、左右拉动滚条时会看到图片从左到右,从上到下布满整个屏幕,完成效果如步骤2)

HTML网页设计——网页背景图片

  • 网页设计HTML中如何插入背景图片
  • html设置网页背景图片全屏
  • html如何文字居中与背景
  • html设置网页背景图片
  • html图片大小怎么设置
  • 热门搜索
    关于新年的手抄报图片 感恩励志手抄报 小学生行为规范手抄报 数学手抄报版面设计 数学手抄报三年级上册 我们爱科学手抄报 梦想手抄报图片 国史党史手抄报资料 快乐读书手抄报内容 猜字谜手抄报