CSS：background 复合属性详解（用法 + 例子 + 效果）
目录
- background 复合属性
- background-color 背景颜色（纯）
- background-image 背景图片 或者 渐变颜色
- background-repeat 背景是否重复
- background-size 设置图片大小
- background-position 设置背景图片显示位置
- background-attachment 设置背景图片是否随页面滚动
background 复合属性
background-color 背景颜色（纯）
.main{width:300px;height:300px;background-color: blue;
}
background-image 背景图片 或者 渐变颜色
background-image:linear-gradient(角度(deg)，颜色1，颜色2, …); 线性渐变（渐变方向，颜色1->颜色2->…）
在背景颜色之上
.main{width:300px;height:300px;background-color: blue; /* */background-image: url(img/R-C.jfif);
}
background-repeat 背景是否重复
横向repeat-x, 纵向repeat-y;
默认repeat，可设为不重复no-repeat
background-repeat:round; 个体完整，微调大小
background-repeat:space; 调整空隙
.main{width:300px;height:300px;background-color: rgb(160, 236, 255); background-image: url(img/R-C.jfif); /* */background-size:30%;background-repeat: space;
}
background-size 设置图片大小
background-size:宽度，高度;
单位可以是像素和百分数。
例如上一个例子中，图片太大了，我们将图片设置为30%。
background-size:30%;
cover 预定义值（覆盖）根据大小自动变化
background-position 设置背景图片显示位置
background-position: 横向偏移量，纵向偏移量;
backgound-position-y; y轴
backgound-position-x; x轴
默认显示左上角0，0;
background-attachment 设置背景图片是否随页面滚动
background-attachment:scroll; 滚动(默认)
background-attachment:fixed; 固定
下面是固定模型的效果：
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>*{padding:0;margin:0;}body{width:100%;}.zw{height: 500px;}.box{width:100%;background-image: url(1.jpg);background-attachment:fixed; height: 300px;}</style>
</head>
<body><div class="zw">占位置</div><div class="zw">占位置</div><div class="box"></div><div class="zw">占位置</div><div class="zw">占位置</div>
</body>
</html>
相关文章：
CSS：background 复合属性详解（用法 + 例子 + 效果）
目录 background 复合属性background-color 背景颜色（纯）background-image 背景图片 或者 渐变颜色background-repeat 背景是否重复background-size 设置图片大小background-position 设置背景图片显示位置background-attachment 设置背景图片是否随页面…...
django中实现事务/django实现悲观锁乐观锁案例
django中实现事务的几种方式 # 1 全局开启事务---> 全局开启事务，绑定的是http请求响应整个过程DATABASES {default: {#全局开启事务，绑定的是http请求响应整个过程ATOMIC_REQUESTS: True, }}from django.db import transaction# 局部禁用事务trans…...
自动驾驶技术：改变交通出行的未来
自动驾驶技术，这个让人充满期待的技术，正在改变我们的交通方式，带来一种全新的出行体验。它可以让汽车、无人机等交通工具像人类驾驶一样自主行驶，通过人工智能、视觉计算、雷达、监控装置和全球定位系统协同合作，实现…...
5.利用matlab完成 符号矩阵的转置和 符号方阵的幂运算（matlab程序）
1.简述 Matlab符号运算中的矩阵转置 转置向量或矩阵 B A. B transpose(A) 说明 B A. 返回 A 的非共轭转置，即每个元素的行和列索引都会互换。如果 A 包含复数元素，则 A. 不会影响虚部符号。例如，如果 A(3,2) 是 12i 且 B A.࿰…...
为什么要自动化Web测试？
Web自动化是更快地实现所需结果的较佳方式。自动化测试在市场上引起了巨大的轰动。此软件测试过程可以让您使用正确的自动化测试工具和技术集自动执行测试过程。我们执行它是为了检查软件应用程序是否具有完全按照我们希望它执行的方式执行的勇气。 比以往更快地获得反馈 自动化…...
Spark_RDD的容错机制_数据丢失恢复
我们都知道Spark是弹性分布式数据集，数据会存储在多台机器上，那么如何确保在分布式数据计算中，数据不丢失就是其中的关键的部分。本文主要讲解一下Spark中的容错机制。 Spark 主要提供了3个层面的数据容错机制。分别是 调度层，RDD…...
VB+SQL期刊信息管理系统设计与实现
摘 要 本次毕业设计课题为“期刊信息管理系统”，该系统在正常运营中总是面对大量的读者信息、期刊信息以及两者相互作用产生的借刊信息，还刊信息。因此需要对读者资源、期刊资源、借刊信息、还刊信息进行管理，及时了解各个环节中信息的变更，有利于提高管理效率。 此次毕…...
如何在iPhone手机上修改手机定位和模拟导航？
如何在iPhone手机上修改手机定位和模拟导航？ English 首先，你需要在Mac电脑上下载安装 Location Simulator/定位模拟工具 和 Runner 这两款应用程序。 完成安装后，打开软件，并用USB连接手机设备 修改iPhone手机定位和模拟导航 …...
Linux 当fork在for循环中的问题
以下代码会打印几个"A"？ 例1.代码如下： int main(int argc, char* argv[],char* envp[]) { for(int i 0;i < 2; i ) { fork(); printf("A\n"); } exit(0); } 代码分析： //父进程for(int i …...
推断统计中非参数检验之卡方检验、列联表分析和游程检验
一、（卡方检验）：赛马比赛的赛道会影响成绩吗 这里以一个实例赛马比赛的赛道是否会影响成绩为例，实际就是检验获胜频数与期望频数之间有无显著性差异。 import pandas as pdstep1 调用包 from scipy.stats import chisquare impor…...
AI社交来了，百度、Soul“双向奔赴”
随着科技的飞速进步和迅猛发展，AI技术已经开始渗透到教育、工作、社交、娱乐和健康多个领域，并为人们生活中的多个场景带来了诸多的创新和可能性。甚至可以说，AI技术已经深刻地介入到了我们日常生活的方方面面，让我们的生活方式发…...
【【verilog 典型电路设计之加法器树乘法器】】
verilog 典型电路设计之加法器树乘法器 加法器树乘法器 加法器树乘法器的设计思想是“移位后加”，并且加法运算采用加法器树的形式。乘法运算的过程是，被乘数与乘数的每一位相乘并且乘以相应的权值，最后将所得的结果相加，便得到了…...
选择最适合自己的NIO， 一探流技术
目录 一、Channel1、FileChannel代码示例2、DatagramChannel代码示例3、SocketChannel 和 ServerSocketChannel代码示例 二、Buffer1、ByteBuffer示例代码2、CharBuffer示例代码3、ShortBuffer、IntBuffer、LongBuffer、FloatBuffer、DoubleBuffer 等示例代码 三、Selector1、S…...
---socket网络控制线程封装)
智能家居(3)---socket网络控制线程封装
封装socket网络线程实现对智能家居中各种灯光的控制 main.Pro(主函数) #include <stdio.h> #include "controlDevice.h" #include "inputCommand.h" #include <pthread.h>struct Devices *pdeviceHead NULL; //设备工厂链表…...
ubuntu 安装 emscripten 时 install latest 安装报错问题
学习官网参考：Compiling a New C/C Module to WebAssembly - WebAssembly | MDN (mozilla.org) 报错信息 形如： Error: Downloading URL https://storage.googleapis.com/webassembly/emscripten-releases-builds/linux/b90507fcf011da61bacfca613569…...
concrt140.dll丢失怎么恢复？教你5种修复方法
首先介绍一下concrt140.dll是什么 concrt140.dll是Microsoft Visual C Redistributable for Visual Studio 2015所需的一个动态链接库文件。它是用于支持C程序运行的重要组件之一。当系统中缺少或丢失concrt140.dll文件时，可能会导致一些程序无法正常运行。 首先&a…...
【Vue-Router】路由入门
路由（Routing）是指确定网站或应用程序中特定页面的方式。在Web开发中，路由用于根据URL的不同部分来确定应用程序中应该显示哪个内容。 构建前端项目 npm init vuelatest //或者 npm init vitelatest安装依赖和路由 npm install npm instal…...
蓝牙耳机运动耳机哪个好、好用的运动蓝牙耳机推荐
如今的蓝牙耳机已经成为手机的最佳伴侣，也是运动爱好者的必备装备。然而，在众多蓝牙耳机中做出选择可能会让人感到困惑。其实，在选购运动蓝牙耳机时需要注意的事项还挺多的，比如舒适度、稳定性和音质等多个方面,逐一对照这些要点来…...
大数据面试题：Kafka的ISR机制
面试题来源： 《大数据面试题 V4.0》 大数据面试题V3.0，523道题，679页，46w字 可回答：1）从ISR踢出去之后呢；2）一般Leader怎么判断Follower挂掉？ 参考答案： …...
Windows：解决MySQL登录ERROR 1045 (28000): Access denied for user ‘root‘@‘localhost‘ (using passwor=YES)问题
我在下载的MySQL是8.0.32版本，刚下的时候没什么问题第二天启动MySQL服务就出现了 ERROR 1045 (28000): Access denied for user rootlocalhost (using password: YES) 或 ERROR 1045 (28000): Access denied for user rootlocalhost (using password: NO) 这样的问题…...
日语AI面试高效通关秘籍：专业解读与青柚面试智能助攻
在如今就业市场竞争日益激烈的背景下，越来越多的求职者将目光投向了日本及中日双语岗位。但是，一场日语面试往往让许多人感到步履维艰。你是否也曾因为面试官抛出的“刁钻问题”而心生畏惧？面对生疏的日语交流环境，即便提前恶补了…...
【Linux】shell脚本忽略错误继续执行
在 shell 脚本中，可以使用 set -e 命令来设置脚本在遇到错误时退出执行。如果你希望脚本忽略错误并继续执行，可以在脚本开头添加 set e 命令来取消该设置。 举例1 #!/bin/bash# 取消 set -e 的设置 set e# 执行命令，并忽略错误 rm somefile…...
K8S认证|CKS题库+答案| 11. AppArmor
目录 11. AppArmor 免费获取并激活 CKA_v1.31_模拟系统 题目 开始操作： 1）、切换集群 2）、切换节点 3）、切换到 apparmor 的目录 4）、执行 apparmor 策略模块 5）、修改 pod 文件 6）、…...
【入坑系列】TiDB 强制索引在不同库下不生效问题
文章目录 背景SQL 优化情况线上SQL运行情况分析怀疑1：执行计划绑定问题？尝试：SHOW WARNINGS 查看警告探索 TiDB 的 USE_INDEX 写法Hint 不生效问题排查解决参考背景 项目中使用 TiDB 数据库，并对 SQL 进行优化了，添加了强制索引。 UAT 环境已经生效，但 PROD 环境强制索…...
学校时钟系统，标准考场时钟系统，AI亮相2025高考，赛思时钟系统为教育公平筑起“精准防线”
2025年#高考 将在近日拉开帷幕，#AI 监考一度冲上热搜。当AI深度融入高考，#时间同步 不再是辅助功能，而是决定AI监考系统成败的“生命线”。 AI亮相2025高考，40种异常行为0.5秒精准识别 2025年高考即将拉开帷幕，江西、…...
通过 Ansible 在 Windows 2022 上安装 IIS Web 服务器
拓扑结构 这是一个用于通过 Ansible 部署 IIS Web 服务器的实验室拓扑。 前提条件： 在被管理的节点上安装WinRm 准备一张自签名的证书 开放防火墙入站tcp 5985 5986端口 准备自签名证书 PS C:\Users\azureuser> $cert New-SelfSignedCertificate -DnsName &…...
【LeetCode】算法详解#6 ---除自身以外数组的乘积
1.题目介绍 给定一个整数数组 nums，返回 数组 answer ，其中 answer[i] 等于 nums 中除 nums[i] 之外其余各元素的乘积 。 题目数据 保证 数组 nums之中任意元素的全部前缀元素和后缀的乘积都在 32 位 整数范围内。 请 不要使用除法，且在 O…...
论文阅读：LLM4Drive: A Survey of Large Language Models for Autonomous Driving
地址：LLM4Drive: A Survey of Large Language Models for Autonomous Driving 摘要翻译 自动驾驶技术作为推动交通和城市出行变革的催化剂，正从基于规则的系统向数据驱动策略转变。传统的模块化系统受限于级联模块间的累积误差和缺乏灵活性的预设规则。…...
xmind转换为markdown
文章目录 解锁思维导图新姿势：将XMind转为结构化Markdown 一、认识Xmind结构二、核心转换流程详解1.解压XMind文件（ZIP处理）2.解析JSON数据结构3：递归转换树形结构4：Markdown层级生成逻辑 三、完整代码 解锁思维导图新…...
C++ Saucer 编写Windows桌面应用
文章目录 一、背景二、Saucer 简介核心特性典型应用场景 三、生成自己的项目四、以Win32项目方式构建Win32项目禁用最大化按钮 五、总结 一、背景 使用Saucer框架，开发Windows桌面应用，把一个html页面作为GUI设计放到Saucer里，隐藏掉运行时弹…...