云一网站设计/搜索网站的浏览器

云一网站设计,搜索网站的浏览器,p2p网站开发的内容,大连比较好的的网站建设公司目录 平面转换平移旋转改变旋转原点多重转换缩放倾斜 渐变线性渐变径向渐变 空间转换平移视距旋转立体呈现缩放 动画使现步骤animation 复合属性animation 属性拆分逐帧动画多组动画 平面转换 作用：为元素添加动态效果，一般与过渡配合使用 概念&#x…

目录

  • 平面转换
    • 平移
    • 旋转
    • 改变旋转原点
    • 多重转换
    • 缩放
    • 倾斜
  • 渐变
    • 线性渐变
    • 径向渐变
  • 空间转换
    • 平移
    • 视距
    • 旋转
    • 立体呈现
    • 缩放
  • 动画
    • 使现步骤
    • animation 复合属性
    • animation 属性拆分
    • 逐帧动画
    • 多组动画

平面转换

作用：为元素添加动态效果，一般与过渡配合使用

概念：改变盒子在平面内的形态（位移、旋转、缩放、倾斜）

平面转换又叫 2D 转换

属性名：transform

代码示例：

<!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>div{margin: 100px 0;width: 100px;height: 100px;background-color: #e08b8b;transition: all 1s;}div:hover{transform: translate(700px) rotate(360deg) scale(2) skew(360deg);}</style>
</head>
<body><div></div>
</body>
</html>

结果如下：

屏幕录制 2025-03-13 153147

平移

属性名：transform: translate(X轴移动距离, Y轴移动距离);

属性值：

  • 像素单位数值
  • 百分比（参照盒子自身尺寸计算结果）
  • 正负均可

代码示例：

<!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>.father{width: 500px;height: 300px;margin: 100px auto;border: 1px solid black;}.son{width: 200px;height: 100px;background-color: antiquewhite;transition: all 0.5s;}.father:hover .son{transform: translate(150%,200%);}</style>
</head>
<body><div class="father"><div class="son"></div></div>
</body>
</html>

结果如下：

屏幕录制 2025-03-13 154956

注意事项：

  • translate() 只写一个值，表示沿着 X 轴移动
  • 单独设置 X 或 Y 轴移动距离：translateX() 或 translateY()

旋转

属性名：transform: rotate(旋转角度);

属性值：

  • 角度单位是 deg
  • 取值正负均可
  • 取正顺时针旋转，取负逆时针旋转

代码示例：

<!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>img{width: 200px;transition: all 1s;}img:hover{transform: rotate(360deg);}</style>
</head>
<body><img src="./img/3.jpg" alt="">
</body>
</html>

结果如下：

屏幕录制 2025-03-13 162633

改变旋转原点

默认情况下，旋转远点是盒子中心点

属性名：transform-origin: 水平原点位置 垂直原点位置;

属性值：

  • 方位名称（left、top、right、bottom、center）
  • 像素单位数值
  • 百分比

代码示例：

<!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>img{width: 200px;transition: all 1s;transform-origin: right bottom;}img:hover{transform: rotate(360deg);}</style>
</head>
<body><img src="./img/3.jpg" alt="">
</body>
</html>

结果如下：

屏幕录制 2025-03-13 163957

多重转换

先平移再旋转

属性名：transform: translate() rotate();

代码示例：

<!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>div{width: 1200px;height: 200px;border: 1px solid black;}img{width: 200px;transition: all 4s;}div:hover img{transform: translateX(500%) rotate(360deg);}</style>
</head>
<body><div><img src="./img/4.jpg" alt=""></div>
</body>
</html>

结果如下：

屏幕录制 2025-03-13 165216

注意事项：

  • 不能先旋转再平移，因为旋转会改变坐标轴向
  • 复合属性不能分开写，否则后面的属性会覆盖前面的属性

缩放

属性名：

  • transform: scale(缩放倍数);
  • transform: scale(X轴缩放倍数, Y轴缩放倍数);

属性值：

  • 通常只为 scale() 设置一个值，表示 X 轴和 Y 轴等比例缩放
  • 取值大于 1 表示放大，取值小于 1 表示缩小

代码示例：

<!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>div{width: 200px;height: 143px;margin: 100px auto;}img{width: 200px;transition: all 4s;}div:hover img{transform: scale(2);}</style>
</head>
<body><div><img src="./img/4.png" alt=""></div>
</body>
</html>

结果如下：

屏幕录制 2025-03-13 171831

倾斜

属性名：transform: skew();

属性值：

  • 角度度数 deg
  • 取正向左倾斜，取负向右倾斜

代码示例：

<!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>div{width: 200px;height: 143px;margin: 100px auto;}img{width: 200px;transition: all 2s;}div:hover img{transform: skew(30deg)}</style>
</head>
<body><div><img src="./img/4.png" alt=""></div>
</body>
</html>

结果如下：

屏幕录制 2025-03-13 174606

渐变

渐变是多个颜色逐渐变化的效果，一般用于设置盒子背景

线性渐变

属性名：

background-image: linear-gradient(渐变方向,颜色1 终点位置,颜色2 终点位置,......
);

属性值：

  • 渐变方向：（可选）
    • to 方位名词
    • 角度度数
  • 终点位置：（可选）
    • 百分比

代码示例：

<!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>div{width: 200px;height: 200px;background-color: #a0adf7;background-image: linear-gradient(45deg, red,#f8a4a4,#a0adf7);}</style>
</head>
<body><div></div>
</body>
</html>

结果如下：
在这里插入图片描述

径向渐变

作用：给按钮添加高光效果

属性名：

background-image: radial-gradient(半径 at 圆心位置,颜色1 终点位置,颜色2 终点位置,......
);

属性值：

  • 半径可以是两条，则为椭圆
  • 圆心位置取值：像素单位数值/百分比/方位名词

代码示例：

<!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>div{width: 100px;height: 100px;background-color: pink;border-radius: 50%;background-image: radial-gradient(50px at center center,red,pink);}button{width: 100px;height: 40px;background-color: purple;border: 0;border-radius: 5px;color: white;background-image: radial-gradient(30px at center center,rgba(255,255,255,0.2),transparent);}</style>
</head>
<body><div></div><button>按钮</button>
</body>
</html>

结果如下：
在这里插入图片描述

空间转换

空间：是从坐标轴角度定义的 X、Y 和 Z 三条坐标轴构成了一个立体空间，Z 轴与视线方向相同

空间转换也叫 3D 转换

属性：transform

平移

属性名：

  • transform: translate3d(x,y,z);
  • transform: translateX();
  • transform: translateY();
  • transform: translateZ();

属性值：

  • 像素单位数值
  • 百分比（参照盒子自身尺寸计算结果）

代码示例：

<!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>.box{width: 200px;height: 200px;margin: 100px auto;background-color: pink;transition: all 0.5s;}.box:hover{transform: translate3d(100px,200px,300px);}</style>
</head>
<body><div class="box"></div>
</body>
</html>

结果如下：

屏幕录制 2025-03-13 194159

注意事项：默认无法观察 Z 轴平移效果

视距

作用：制定了观察者与 z=0 平面的距离，为元素添加透视效果

透视效果：近大远小、近实远虚

属性名：perspective: 视距;

属性值：

  • 添加给父级，取值范围 800-1200

代码示例：

<!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>.father{perspective: 1000px;}.son{width: 200px;height: 200px;margin: 100px auto;background-color: pink;transition: all 0.5;}.son:hover{transform: translateZ(-300px);}</style>
</head>
<body><div class="father"><div class="son"></div></div>
</body>
</html>

结果如下：

屏幕录制 2025-03-13 195356

旋转

属性名：

transform: rotateZ() 沿着 Z 轴旋转

transform: rotateX() 沿着 X 轴旋转

transform: rotateY() 沿着 Y 轴旋转

transform: rotate3d(x,y,z,角度度数); x，y，z 取值为 0-1 之间的数字

代码示例：

<!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>div{width: 300px;margin: 100px auto;perspective: 1000px;}img{width: 200px;transition: all 2s;}.d1 img:hover{transform: rotateZ(360deg);}.d2 img:hover{transform: rotateX(60deg);}.d3 img:hover{transform: rotateY(60deg);}</style>
</head>
<body><div class="d1"><img src="./img/3.jpg" alt=""></div><div class="d2"><img src="./img/1.png" alt=""></div><div class="d3"><img src="./img/2.png" alt=""></div>
</body>
</html>

结果如下：

屏幕录制 2025-03-13 201450

左手法则

根据旋转方向确定取值正负

左手握住旋转轴，拇指指向正值方向，其他四个手指弯曲方向为旋转正值方向
在这里插入图片描述

立体呈现

作用：设置元素的子元素是位于 3D 空间中还是平面中

属性名：transform-style

属性值：

  • flat：子级处于平面中
  • preserve-3d：子级处于 3D 空间中

呈现立体图形步骤：

  1. 父元素添加 transform-style: preserve-3d;
  2. 子级定位
  3. 调整子盒子的位置（位移或旋转）
<!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>.cube{position: relative;width: 200px;height: 200px;margin: 100px auto;/* background-color: pink; */transition: all 1s;transform-style: preserve-3d;}.cube div{position: absolute;left: 0;top: 0;width: 200px;height: 200px;}.front{background-color: orange;transform: translateZ(100px);}.back{background-color: green;transform: translateZ(-100px);}.cube:hover{transform: rotateY(90deg);}</style>
</head>
<body><div class="cube"><div class="front">前面</div><div class="back">后面</div></div>
</body>
</html>

结果如下：

屏幕录制 2025-03-13 213518

缩放

属性名：

  • transform: scale3d(x,y,z);
  • transform: scaleX();
  • transform: scaleY();
  • transform: scaleZ();

代码示例：

<!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>.cube{position: relative;width: 200px;height: 200px;margin: 100px auto;/* background-color: pink; */transition: all 4s;transform-style: preserve-3d;transform: scale3d(1.5,2,3);}.cube div{position: absolute;left: 0;top: 0;width: 200px;height: 200px;}.front{background-color: orange;transform: translateZ(100px);}.back{background-color: green;transform: translateZ(-100px);}.cube:hover{transform: rotate3d(1,1,1,90deg);}</style>
</head>
<body><div class="cube"><div class="front">前面</div><div class="back">后面</div></div>
</body>
</html>

结果如下：

屏幕录制 2025-03-13 220517

动画

过渡：实现两个状态间的变化过程

动画：实现多个动态间的变化过程，动画过程可控（重复播放、最终画面、是否暂停）

代码示例：

<!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>.d1{width: 1000px;height: 200px;border: 1px solid black;}.d2{width: 200px;height: 200px;background-color: pink;animation: change 1s infinite alternate;}@keyframes change {0% {transform: translate(0);}100% {transform: translate(800px);}}</style>
</head>
<body><div class="d1"><div class="d2"></div></div>
</body>
</html>

结果如下：

屏幕录制 2025-03-13 221903

使现步骤

定义动画

  • 两个状态
@keyframes 动画名称 {from {}to {}
}
  • 多个状态
@keyframes 动画名称 {0% {}10% {}......100% {}
}

使用动画

animation: 动画名称 动画花费时长;

代码示例：

<!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>div{width: 200px;height: 200px;background-color: pink;animation: change 10s;}@keyframes change {0% {width: 200px;height: 200px;}25% {width: 400px;height: 200px;}75% {width: 400px;height: 400px;}100% {border-radius: 50%;}}</style>
</head>
<body><div></div>
</body>
</html>

结果如下：

屏幕录制 2025-03-13 235715

animation 复合属性

animation: 动画名称 动画时长 速度曲线 延迟时间 重复次数 动画方向 执行完毕时状态;

  • 速度曲线：
    • linear：匀速运动
    • steps()：括号里填数字，表示分几步完成动画
  • 重复次数：
    • infinite：无限循环重复播放
  • 动画方向：
    • alternate：反向执行
  • 执行完毕时状态：
    • backwards：开始状态
    • forwards：结束状态

代码示例：

<!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>.box{width: 200px;height: 100px;background-color: pink;animation:  change 1s linear 1s 3 alternate forwards;}@keyframes change {from {width: 200px;}to {width: 800px;}}</style>
</head>
<body><div class="box"></div>
</body>
</html>

结果如下：

屏幕录制 2025-03-14 002430

注意事项：

  • 动画名称和动画时长必须赋值
  • 取值不分先后顺序
  • 如果有两个时间值，第一个时间值表示动画时长，第二个时间值表示延迟时间

animation 属性拆分

属性作用取值
animation-name动画名称
animation-duration动画时长
animation-delay延迟时间
animation-fill-mode动画执行完毕时状态forwards：最后一帧状态
backwards：第一帧状态
animation-timing-function速度曲线steps (数字)：逐帧动画
animation-iteration-count重复次数infinite 为无限循环
animation-direction动画执行方向alternate 为反向
animation-play-state暂停动画paused 为暂停，通常配合:hover 使用

逐帧动画

核心原理：

  • steps() 逐帧动画
  • CSS 精灵图

精灵动画制作步骤：

  1. 准备显示区域：盒子尺寸与一张精灵小图尺寸相同
  2. 定义动画：移动背景图（移动距离 = 精灵图宽度）
  3. 使用动画：strps(N)，N 与精灵小图个数相同

代码示例：

<!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>div{width: 140px;height: 140px;border: 1px solid black;background-image: url(./img/01.png);animation: run 1s steps(12) infinite;}</style>
</head>
<body><div></div>
</body>
</html>

结果如下：

屏幕录制 2025-03-14 144049

多组动画

语法格式：

animation: 动画1,动画2,......
;

代码示例：

<!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>div{width: 140px;height: 140px;/* border: 1px solid black; */background-image: url(./img/01.png);animation: run 1s steps(12) infinite,move 5s linear forwards;}@keyframes run {from {background-position: 0 0;}            to {background-position: -1680px 0;}}@keyframes move {0% {transform: translate(0);}100% {transform: translate(800px);}}</style>
</head>
<body><div></div>
</body>
</html>

结果如下：

屏幕录制 2025-03-14 144234

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/pingmian/72634.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

Java 线程创建全解析：五种方式详细对比与实战示例

Java 线程创建全解析：五种方式详细对比与实战示例

目录 Java 线程创建全解析&#xff1a;五种方式详细对比与实战示例一、引言二、创建线程的五种方式1. 继承 Thread 类2. 实现 Runnable 接口3. 匿名内部类实现 Thread4. 匿名内部类实现 Runnable5. 使用 Lambda 表达式&#xff08;Java 8及以上&#xff09; 三、线程创建方式对…
阅读更多...
EDAS：投稿经验-word版本-问题解决

EDAS：投稿经验-word版本-问题解决

1. 字体不对&#xff0c;字体未嵌入问题 问题&#xff1a;word转PDF后&#xff0c;总是显示有字体格式不对&#xff08;忘记截图了&#xff09;。 办法&#xff1a;1. EDAS投稿PDF格式问题-CSDN博客-PDF上修改 IEEE论文检测的字体未嵌入问题Times New Ro…
阅读更多...
[C++面试] 标准容器面试点

[C++面试] 标准容器面试点

一、入门 1、vector和list的区别 [C面试] vector 面试点总结 vector 是动态数组&#xff0c;它将元素存储在连续的内存空间中。支持随机访问&#xff0c;即可以通过下标快速访问任意位置的元素&#xff0c;时间复杂度为 O(1)&#xff0c;准确点是均摊O(1)。但在中间或开头插…
阅读更多...
C# NX二次开发：拉伸UFUN函数避坑指南

C# NX二次开发：拉伸UFUN函数避坑指南

大家好&#xff0c;今天想说一下拉伸相关UFUN函数的使用&#xff0c;尽量让大家别踩坑。 官方给出的拉伸UFUN函数有如下几个&#xff1a; &#xff08;1&#xff09;UF_MODL_create_extruded2 (view source) uf_list_p_tobjectsInputList of objects to be extruded.char *ta…
阅读更多...
基于 Python 爬取 TikTok 搜索数据 Tiktok爬虫（2025.3.17）

基于 Python 爬取 TikTok 搜索数据 Tiktok爬虫（2025.3.17）

1. 前言 在数据分析和网络爬虫的应用场景中&#xff0c;我们经常需要获取社交媒体平台的数据&#xff0c;例如 TikTok。本篇文章介绍如何使用 Python 爬取 TikTok 用户搜索数据&#xff0c;并解析其返回的数据。 结果截图 2. 项目环境准备 在正式运行代码之前&#xff0c;我…
阅读更多...
关于deepseek R1模型分布式推理效率分析

关于deepseek R1模型分布式推理效率分析

1、引言 DeepSeek R1 采用了混合专家&#xff08;Mixture of Experts&#xff0c;MoE&#xff09;架构&#xff0c;包含多个专家子网络&#xff0c;并通过一个门控机制动态地激活最相关的专家来处理特定的任务 。DeepSeek R1 总共有 6710 亿个参数&#xff0c;但在每个前向传播…
阅读更多...
二叉树算法题实战：从遍历到子树判断

二叉树算法题实战：从遍历到子树判断

目录 一、引言 二、判断两棵二叉树是否相同 思路 代码实现 注意点 三、二叉树的中序遍历 思路 代码实现 注意点 四、判断一棵树是否为另一棵树的子树 思路 代码实现 注意点 ​编辑 五、补充 一、引言 作者主页&#xff1a;共享家9527-CSDN博客 作者代码仓库&am…
阅读更多...
【开原宝藏】30天学会CSS - DAY1 第一课

【开原宝藏】30天学会CSS - DAY1 第一课

下面提供一个由浅入深、按步骤拆解的示例教程&#xff0c;让你能从零开始&#xff0c;逐步理解并实现带有旋转及悬停动画的社交图标效果。为了更简单明了&#xff0c;以下示例仅创建四个图标&#xff08;Facebook、Twitter、Google、LinkedIn&#xff09;&#xff0c;并在每一步…
阅读更多...
HarmonyOS第22天：解锁鸿蒙服务开发

HarmonyOS第22天：解锁鸿蒙服务开发

走进鸿蒙服务开发的世界 在移动应用开发的领域中&#xff0c;HarmonyOS 以其独特的分布式理念和强大的系统能力&#xff0c;为开发者们开辟了一片崭新的天地。其中&#xff0c;服务开发作为 HarmonyOS 应用开发的关键环节&#xff0c;犹如一把神奇的钥匙&#xff0c;能够帮助开…
阅读更多...
鸿蒙应用程序包HAP的开发与使用

鸿蒙应用程序包HAP的开发与使用

1、HAP是什么&#xff1f; HAP&#xff08;Harmony Ability Package&#xff09;是应用安装和运行的基本单元。HAP包是由代码、资源、第三方库、配置文件等打包生成的模块包&#xff0c;其主要分为两种类型&#xff1a;entry和feature。 entry&#xff1a;应用的主模块&#x…
阅读更多...
解决qt中自定插件加载失败，不显示问题。

解决qt中自定插件加载失败，不显示问题。

这个问题断断续续搞了一天多&#xff0c;主要是版本不匹配问题。 我们先来看下 Based on Qt 6.6.0 → 说明 Qt Creator 本身 是基于 Qt 6.6.0 框架构建的。MSVC 2019, 64-bit → 说明 Qt Creator 是使用 Microsoft Visual C 2019 编译器&#xff08;64 位&#xff09; 编译的。…
阅读更多...
进程间通信--匿名管道

进程间通信--匿名管道

进程间通信介绍 进程间通信目的 数据传输&#xff1a;一个进程需要将它的数据发送给另一个进程资源共享&#xff1a;多个进程之间共享同样的资源。通知事件&#xff1a;一个进程需要向另一个或一组进程发送消息&#xff0c;通知它&#xff08;它们&#xff09;发生了某种事件&…
阅读更多...
CSS块元素、行内元素、行内块元素详解

CSS块元素、行内元素、行内块元素详解

一、块元素&#xff08;Block Elements&#xff09; 1.定义与特点 独占一行&#xff1a;默认情况下&#xff0c;块元素会从新的一行开始&#xff0c;并且其后的元素也会被推到下一行。可设置宽高&#xff1a;可以自由设置宽度&#xff08;width&#xff09;和高度&#xff08…
阅读更多...
Word 小黑第22套

Word 小黑第22套

对应大猫23 续编号&#xff08;编号断了&#xff0c;从一开始&#xff09;&#xff1a;点编号&#xff0c;再设置编号值 插入以图标方式显示的文档&#xff1a;插入 -对象 -由文件创建 &#xff08;这里要链接到文件也要勾选 不然扣一分&#xff09; 一个页面设为横向不影响上…
阅读更多...
平面波扬声器 VS球面波扬声器的原理与优缺点对比

平面波扬声器 VS球面波扬声器的原理与优缺点对比

一、核心定义与原理 1、平面波扬声器 1.1、平面波扬声器的定义‌&#xff1a;通过“相控阵”技术控制声波相位&#xff0c;使声波以平行线&#xff08;面&#xff09;定向传播的扬声器&#xff0c;声波近似平面振动&#xff0c;能量集中且衰减缓慢‌。 1.2、平面波扬声器的原…
阅读更多...
设计模式之命令设计模式

设计模式之命令设计模式

命令设计模式&#xff08;Command Pattern&#xff09; 请求以命令的形式包裹在对象中&#xff0c;并传给调用对象。调用对象寻找可以处理该命令的对象&#xff0c;并把该命令传给相应的对象执行命令&#xff0c;属于行为型模式命令模式是一种特殊的策略模式&#xff0c;体现的…
阅读更多...
力扣hot100二刷——二叉树

力扣hot100二刷——二叉树

第二次刷题不在idea写代码&#xff0c;而是直接在leetcode网站上写&#xff0c;“逼”自己掌握常用的函数。 标志掌握程度解释办法⭐Fully 完全掌握看到题目就有思路&#xff0c;编程也很流利⭐⭐Basically 基本掌握需要稍作思考&#xff0c;或者看到提示方法后能解答⭐⭐⭐Sl…
阅读更多...
从“自习室令牌”到线程同步：探秘锁与条件变量

从“自习室令牌”到线程同步：探秘锁与条件变量

目录 互斥 为什么需要锁 锁的原理--互斥 锁的使用 同步 锁的问题 条件变量 互斥 为什么需要锁 先看结果&#xff1a; 以下代码是我模拟创建线程抢票&#xff0c;由于不加锁导致票抢到了负数 main.cc: #include<vector> #include<iostream> #include"…
阅读更多...
字符串哈希从入门到精通

字符串哈希从入门到精通

一、基本概念 字符串哈希是将任意长度的字符串映射为固定长度的哈希值&#xff08;通常为整数&#xff09;的技术&#xff0c;核心目标是实现O(1)时间的子串快速比较和高效查询。其本质是通过数学运算将字符串转换为唯一性较高的数值&#xff0c;例如&#xff1a; ​​​​​​…
阅读更多...
什么是数学建模？数学建模是将实际问题转化为数学问题

什么是数学建模？数学建模是将实际问题转化为数学问题

数学建模是将实际问题转化为数学问题&#xff0c;并通过数学工具进行分析、求解和验证的过程。 一、数学建模的基本流程 问题分析 • 明确目标&#xff1a;确定需要解决的核心问题。 • 简化现实&#xff1a;识别关键变量、忽略次要因素。 • 定义输入和输出&#xff1a;明确模…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023