网页如何设置背景图片

简介: 网页如何设置背景图片

添加CSS样式即可:

body{
        background:url(image/background.jpg);
        background-size:cover;
        background-attachment:fixed;
        background-color:#CCCCCC;
        }

效果图:

(图片、代码资源点此链接免费下载)

详解

b    body {
      background-image: url(image/background.jpg); /*加载背景图*/
      background-position: center center;  /* 背景图垂直、水平均居中 */
      background-repeat: no-repeat; /* 背景图不平铺 */ 
      background-attachment: fixed;  /* 当内容高度大于图片高度时,背景图像的位置相对于viewport固定 */
      background-size: cover;  /* 让背景图基于容器大小伸缩(此条属性必须设置否则可能无效) */
      background-color: #2a9d79;  /* 设置背景颜色,背景图加载过程中会显示背景色 */
    }

CSS background 属性

说明 CSS
background-color 指定要使用的背景颜色 1
background-position 指定背景图像的位置 1
background-size 指定背景图片的大小 3
background-repeat 指定如何重复背景图像 1
background-origin 指定背景图像的定位区域 3
background-clip 指定背景图像的绘画区域 3
background-attachment 设置背景图像是否固定或者随着页面的其余部分滚动 1
background-image 指定要使用的一个或多个背景图像 1
相关文章
|
测试技术 uml UED
软件需求管理:从获取到变更的全过程
【8月更文第20天】在软件开发项目中,需求管理是确保产品满足用户期望和业务目标的关键环节。本文将探讨软件需求管理的基本概念、需求获取的方法、需求分析与建模的实践、需求验证与确认的策略以及需求变更管理的最佳实践。
1076 5
|
SQL Oracle 关系型数据库
Entity Framework Core 实现多数据库支持超厉害!配置连接、迁移与事务,开启多元数据库之旅!
【8月更文挑战第31天】在现代软件开发中,为了满足不同业务需求及环境要求,常需支持多个数据库系统。Entity Framework Core(EF Core)作为一款强大的对象关系映射(ORM)框架,通过数据库提供程序与多种数据库如SQL Server、MySQL、PostgreSQL、Oracle等交互。开发者可通过安装相应NuGet包并配置`DbContextOptionsBuilder`来指定不同数据库连接,从而实现多数据库支持。
1304 0
|
消息中间件 存储 网络协议
从零开始掌握进程间通信:管道、信号、消息队列、共享内存大揭秘
在操作系统中,进程间通信(IPC)是至关重要的,它提供了多种机制来实现不同进程间的数据交换和同步。本篇文章将详细介绍几种常见的IPC方式,包括管道、信号、消息队列、共享内存、信号量和套接字,帮助你深入理解并合理应用这些通信方式,提高系统性能与可靠性。
694 0
|
机器学习/深度学习 自然语言处理 机器人
「随笔」如何评价GPT-4o
GPT-4o,OpenAI的最新力作,以其巨大模型规模、海量训练数据及先进技术,刷新文本生成与理解的界限。它生成的文本更自然,理解力更深,支持多语言,能理解长文本上下文并整合广泛知识。同时,GPT系列展现创新与实用性,未来潜力无限,但也面临准确性、偏见等挑战。
189 0
|
关系型数据库 MySQL 数据挖掘
Mysql与StarRocks语法上的不同
Mysql与StarRocks语法上的不同
|
JavaScript 编译器
TS中const和readonly的区别
TS中const和readonly的区别
263 0
|
JavaScript 前端开发 程序员
通过一篇文章带你解决如何加密代码任然可以运行
在实际生活中,作为程序员偶尔会因为资金不够用了选择去兼职写代码,当我们写完一个代码,将他发给某个公司的时候,我们经常会想到如何让目标公司看不见你写的源代码(源代码是你好不容易想出来的,难免不有些心疼嘛),但目标公司却可以运行他所需要的代码,下面我将讲解一种静态库的使用方法,来实现这个方法。
624 0
av_seek_frame实战--跳转到文件指定时间后开始推流或写入新文件
av_seek_frame实战--跳转到文件指定时间后开始推流或写入新文件
239 0
av_seek_frame实战--跳转到文件指定时间后开始推流或写入新文件
|
SQL 关系型数据库 MySQL
Mysql主从同步报错解决:Fatal error: The slave I/O thread stops because ..
Mysql主从同步报错解决:Fatal error: The slave I/O thread stops because ..
1393 0