当前位置：首页 > article >正文

CSS3学习教程，从入门到精通，CSS3 属性语法知识点及案例代码（4）

article 2026/3/7 13:43:30

CSS3 属性语法知识点及案例代码

一、CSS3 文本属性

1. 颜色相关属性

color：设置文本颜色。
text-shadow：设置文本阴影。

2. 字体相关属性

font-family：设置字体系列。
font-size：设置字体大小。
font-weight：设置字体粗细。
font-style：设置字体风格（如斜体）。

3. 文本修饰属性

text-decoration：设置文本装饰（如下划线）。
text-align：设置文本对齐方式。
line-height：设置行高。
letter-spacing：设置字母间距。
word-spacing：设置单词间距。

4. 文本转换属性

text-transform：设置文本转换（如大写、小写）。

二、CSS3 盒模型属性

1. 外边距属性

margin：设置外边距。
margin-top、margin-right、margin-bottom、margin-left：分别设置上、右、下、左边的外边距。

2. 内边距属性

padding：设置内边距。
padding-top、padding-right、padding-bottom、padding-left：分别设置上、右、下、左边的内边距。

3. 宽度和高度属性

width：设置元素宽度。
height：设置元素高度。

4. 边框属性

border：设置边框。
border-width、border-style、border-color：分别设置边框的宽度、样式和颜色。
border-radius：设置边框圆角。

三、CSS3 背景属性

1. 背景颜色和图像

background-color：设置背景颜色。
background-image：设置背景图像。
background-repeat：设置背景图像是否重复。
background-position：设置背景图像的位置。
background-size：设置背景图像的大小。
background-attachment：设置背景图像是否固定或滚动。

四、CSS3 盒子阴影和轮廓

1. 盒子阴影

box-shadow：设置盒子阴影。

2. 轮廓

outline：设置轮廓。
outline-width、outline-style、outline-color：分别设置轮廓的宽度、样式和颜色。

五、CSS3 二维转换

1. 基本转换

transform：设置元素的二维转换。
transform-origin：设置转换的原点。

六、CSS3 动画

1. 关键帧动画

@keyframes：定义动画的关键帧。
animation：应用动画。
animation-name、animation-duration、animation-timing-function、animation-delay、animation-iteration-count、animation-direction、animation-fill-mode、animation-play-state：分别设置动画的名称、持续时间、速度曲线、延迟、迭代次数、方向、填充模式和播放状态。

七、CSS3 多列布局

1. 多列属性

column-count：设置列数。
column-width：设置列宽。
column-gap：设置列之间的间隔。
column-rule：设置列之间的分隔线。

八、CSS3 弹性布局

1. 弹性容器属性

display: flex：将元素设置为弹性容器。
flex-direction：设置主轴方向。
flex-wrap：设置是否换行。
justify-content：设置主轴对齐方式。
align-items：设置侧轴对齐方式。
align-content：设置多行对齐方式。

2. 弹性项目属性

order：设置项目的排列顺序。
flex-grow：设置项目的扩展比例。
flex-shrink：设置项目的收缩比例。
flex-basis：设置项目的初始主轴长度。
align-self：设置项目的侧轴对齐方式。

九、CSS3 网格布局

1. 网格容器属性

display: grid：将元素设置为网格容器。
grid-template-columns、grid-template-rows：设置网格的列和行。
grid-gap：设置网格之间的间隔。
grid-template-areas：设置网格区域。

2. 网格项目属性

grid-column、grid-row：设置项目在网格中的位置。
grid-area：设置项目的网格区域。

十、CSS3 过渡效果

1. 过渡属性

transition：设置过渡效果。
transition-property、transition-duration、transition-timing-function、transition-delay：分别设置过渡的属性、持续时间、速度曲线和延迟。

十一、CSS3 滤镜效果

1. 滤镜属性

filter：设置滤镜效果。

十二、CSS3 媒体查询

1. 媒体查询属性

@media：用于响应式设计，根据不同的屏幕尺寸设置不同的样式。

十三、CSS3 伪元素和伪类

1. 伪元素

::before、::after：在元素前后插入内容。
::first-letter、::first-line：设置首字母和首行样式。

2. 伪类

:hover、:active、:focus：设置元素在不同状态下的样式。

十四、CSS3 颜色函数

1. 颜色函数

rgb()、rgba()、hsl()、hsla()：设置颜色。

十五、CSS3 字体图标

1. 字体图标属性

@font-face：自定义字体。

十六、CSS3 文本溢出

1. 文本溢出属性

text-overflow：设置文本溢出时的显示方式。

十七、CSS3 盒模型增强

1. 盒模型属性

box-sizing：设置盒模型的计算方式。

十八、CSS3 动画和过渡综合案例

案例：按钮悬停效果

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>CSS3 按钮悬停效果</title><style>/* 设置按钮的基本样式 */.btn {display: inline-block;padding: 10px 20px;margin: 20px;border: none;border-radius: 5px;color: white;text-align: center;cursor: pointer;transition: all 0.3s ease; /* 设置过渡效果 */box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* 设置阴影 */}/* 不同按钮的背景颜色 */.btn-primary {background-color: #007bff;}.btn-secondary {background-color: #6c757d;}.btn-success {background-color: #28a745;}.btn-danger {background-color: #dc3545;}/* 按钮悬停效果 */.btn:hover {transform: translateY(-2px); /* 向上移动 */box-shadow: 0 6px 8px rgba(0, 0, 0, 0.2); /* 增大阴影 */}/* 按钮按下效果 */.btn:active {transform: translateY(1px); /* 向下移动 */box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* 减小阴影 */}/* 按钮禁用状态 */.btn:disabled {opacity: 0.6;cursor: not-allowed;}/* 使用伪元素添加图标 */.btn::before {content: "▶ ";font-weight: bold;}</style>
</head>
<body><button class="btn btn-primary">主要按钮</button><button class="btn btn-secondary">次要按钮</button><button class="btn btn-success">成功按钮</button><button class="btn btn-danger" disabled>危险按钮</button>
</body>
</html>

案例代码说明

基本样式设置：为按钮设置了基本的样式，包括内边距、外边距、边框、圆角、颜色等。
过渡效果：使用 transition 属性为按钮的属性变化添加平滑的过渡效果。
阴影效果：使用 box-shadow 属性为按钮添加阴影，增强立体感。
悬停效果：通过 :hover 伪类，在鼠标悬停时改变按钮的位置和阴影，实现上浮效果。
按下效果：通过 :active 伪类，在按钮被按下时改变其位置和阴影，模拟被按下的状态。
禁用状态：通过 :disabled 伪类，为禁用的按钮设置透明度和鼠标样式，表示不可用。
伪元素：使用 ::before 伪元素在按钮前添加图标，增强视觉效果。

这个案例综合运用了 CSS3 的多种属性和伪类，展示了如何通过 CSS3 实现丰富的按钮交互效果。

以下是 CSS3 属性在实际开发中的一些具体案例，涵盖了常见属性的实际应用，每个案例都包含详细注释：

案例一：简单的导航栏样式

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>导航栏样式</title><style>/* 导航栏容器样式 */.navbar {background-color: #333; /* 设置背景颜色 */padding: 10px 20px; /* 设置内边距 */border-radius: 5px; /* 设置圆角 */box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* 添加阴影 */}/* 导航链接样式 */.navbar a {color: white; /* 设置文本颜色 */text-decoration: none; /* 去掉下划线 */margin-right: 15px; /* 设置右边距 */padding: 5px 10px; /* 设置内边距 */transition: background-color 0.3s ease; /* 添加过渡效果 */}/* 鼠标悬停时的样式 */.navbar a:hover {background-color: #555; /* 改变背景颜色 */border-radius: 3px; /* 设置圆角 */}/* 当前页面活动链接样式 */.navbar a.active {color: #04AA6D; /* 设置活动链接的颜色 */font-weight: bold; /* 加粗字体 */}</style>
</head>
<body><nav class="navbar"><a href="#" class="active">首页</a><a href="#">关于我们</a><a href="#">服务</a><a href="#">联系我们</a></nav>
</body>
</html>

案例二：响应式卡片布局

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>响应式卡片布局</title><style>/* 卡片容器样式 */.card-container {display: flex; /* 使用弹性布局 */flex-wrap: wrap; /* 允许换行 */gap: 20px; /* 设置卡片之间的间隔 */padding: 20px;}/* 卡片样式 */.card {flex: 1; /* 卡片在容器中等分空间 */min-width: 250px; /* 设置最小宽度 */background-color: white; /* 设置背景颜色 */border-radius: 8px; /* 设置圆角 */box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); /* 添加阴影 */padding: 15px; /* 设置内边距 */transition: transform 0.3s ease; /* 添加过渡效果 */}/* 鼠标悬停时的样式 */.card:hover {transform: translateY(-5px); /* 向上移动 */}/* 卡片标题样式 */.card h3 {color: #333; /* 设置标题颜色 */margin-top: 0; /* 去掉上边距 */}/* 卡片内容样式 */.card p {color: #666; /* 设置内容颜色 */line-height: 1.5; /* 设置行高 */}/* 响应式设计 */@media (max-width: 768px) {.card-container {flex-direction: column; /* 在小屏幕上改为垂直布局 */}}</style>
</head>
<body><div class="card-container"><div class="card"><h3>卡片标题 1</h3><p>这是一个卡片内容。卡片可以用于展示信息，是现代网页设计中常见的组件。</p></div><div class="card"><h3>卡片标题 2</h3><p>这是另一个卡片内容。通过 CSS3 属性，我们可以轻松地为卡片添加样式，使其看起来更加美观。</p></div></div>
</body>
</html>

案例三：按钮样式与交互效果

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>按钮样式与交互效果</title><style>/* 按钮基本样式 */.btn {display: inline-block; /* 设置为行内块元素 */padding: 10px 20px; /* 设置内边距 */background-color: #007bff; /* 设置背景颜色 */color: white; /* 设置文本颜色 */border: none; /* 去掉边框 */border-radius: 5px; /* 设置圆角 */cursor: pointer; /* 设置鼠标指针为手型 */transition: all 0.3s ease; /* 添加过渡效果 */box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* 添加阴影 */}/* 鼠标悬停时的样式 */.btn:hover {background-color: #0056b3; /* 改变背景颜色 */transform: translateY(-2px); /* 向上移动 */box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); /* 改变阴影 */}/* 按钮按下时的样式 */.btn:active {transform: translateY(1px); /* 向下移动 */box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); /* 改变阴影 */}/* 禁用按钮的样式 */.btn:disabled {opacity: 0.6; /* 设置透明度 */cursor: not-allowed; /* 设置鼠标指针为禁止状态 */}</style>
</head>
<body><button class="btn">点击我</button><button class="btn" disabled>禁用按钮</button>
</body>
</html>

案例四：文本溢出处理

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>文本溢出处理</title><style>/* 文本容器样式 */.text-container {width: 200px; /* 设置宽度 */border: 1px solid #ddd; /* 设置边框 */padding: 10px; /* 设置内边距 */margin: 20px; /* 设置外边距 */background-color: #f9f9f9; /* 设置背景颜色 */}/* 单行文本溢出处理 */.single-line {white-space: nowrap; /* 不换行 */overflow: hidden; /* 隐藏溢出部分 */text-overflow: ellipsis; /* 添加省略号 */}/* 多行文本溢出处理 */.multi-line {display: -webkit-box; /* 使用 Webkit 盒模型 */-webkit-box-orient: vertical; /* 垂直排列 */-webkit-line-clamp: 3; /* 设置显示的行数 */overflow: hidden; /* 隐藏溢出部分 */}</style>
</head>
<body><div class="text-container"><h3>单行文本溢出</h3><p class="single-line">这是一个很长的文本，用于演示单行文本溢出时的效果。文本内容超出了容器的宽度。</p></div><div class="text-container"><h3>多行文本溢出</h3><p class="multi-line">这是一个很长的文本，用于演示多行文本溢出时的效果。文本内容超出了容器的高度，这里只显示前三行，多余的部分被隐藏。</p></div>
</body>
</html>

案例五：弹性布局应用

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>弹性布局应用</title><style>/* 容器样式 */.container {display: flex; /* 使用弹性布局 */justify-content: space-between; /* 主轴对齐方式 */padding: 20px;background-color: #f5f5f5; /* 设置背景颜色 */}/* 左侧边栏样式 */.sidebar {flex: 0 0 200px; /* 设置固定宽度 */background-color: #ddd; /* 设置背景颜色 */padding: 15px; /* 设置内边距 */border-radius: 5px; /* 设置圆角 */}/* 主要内容区域样式 */.main-content {flex: 1; /* 剩余空间等分 */background-color: white; /* 设置背景颜色 */padding: 15px; /* 设置内边距 */border-radius: 5px; /* 设置圆角 */margin-left: 20px; /* 设置左边距 */}</style>
</head>
<body><div class="container"><div class="sidebar"><h3>侧边栏</h3><p>这里可以放置导航菜单或其他辅助内容。</p></div><div class="main-content"><h3>主要内容</h3><p>这里是页面的主要内容区域，使用弹性布局可以确保它在不同屏幕尺寸下都能良好显示。</p></div></div>
</body>
</html>

这些案例展示了 CSS3 属性在实际开发中的广泛应用，从简单的样式设置到复杂的布局和交互效果，CSS3 提供了丰富的功能来满足现代网页设计的各种需求。

CSS3学习教程，从入门到精通，CSS3 属性语法知识点及案例代码（4）

CSS3 属性语法知识点及案例代码一、CSS3 文本属性 1. 颜色相关属性 color：设置文本颜色。text-shadow：设置文本阴影。 2. 字体相关属性 font-family：设置字体系列。font-size：设置字体大小。font-weight：设置字体…...

编程日记 2026/2/21 5:06:17

MyBatis SqlSession 是如何创建的？它与 SqlSessionFactory 有什么关系？

SqlSession 是 MyBatis 中与数据库交互的核心接口，它提供了执行 SQL 语句、管理事务、获取 Mapper 接口代理对象等关键功能。 SqlSession 实例不是直接通过 new 关键字创建的，而是通过 SqlSessionFactory 工厂来创建的。 SqlSessionFactory 负责创建 Sq…...

编程日记 2026/2/27 13:18:03

【操作系统安全】任务4：Windows 系统网络安全实践里常用 DOS 命令

目录一、引言二、网络信息收集类命令 2.1 ipconfig 命令 2.1.1 功能概述 2.1.2 实例与代码 2.2 ping 命令 2.2.1 功能概述 2.2.2 实例与代码 2.3 tracert 命令 2.3.1 功能概述 2.3.2 实例与代码三、网络连接与端口管理类命令 3.1 netstat 命令 3.1.1 功能概述…...

编程日记 2026/2/25 2:35:42

Vue 概念、历史、发展和Vue简介

一、Vue概念官方定义： 渐进式JavaScript 框架，易学易用，性能出色，适用场景丰富的 Web 前端框架。 Vue.js 是一个流行的前端JavaScript框架，由尤雨溪（Evan You）开发并维护。它最初于2014年发…...

编程日记 2026/2/14 22:01:00

【从零开始学习计算机科学】信息安全（二）物理安全

【从零开始学习计算机科学】信息安全（二）物理安全物理安全物理安全的涵义物理安全威胁常见物理安全问题物理安全需求规划物理安全需求设备安全防盗和防毁机房门禁系统机房入侵检测和报警系统防电磁泄漏防窃听设备管理设备维护设备的处置和重复利用设备的转移电源安全电源调整…...

编程日记 2026/3/1 0:22:12

LeetCode hot 100—验证二叉搜索树

题目给你一个二叉树的根节点 root ，判断其是否是一个有效的二叉搜索树。有效二叉搜索树定义如下： 节点的左子树只包含小于当前节点的数。节点的右子树只包含大于当前节点的数。所有左子树和右子树自身必须也是二叉搜索树。示例示例 1&#…...

编程日记 2026/3/6 7:23:47

【商城实战(39)】Spring Boot 携手微服务，商城架构焕新篇

【商城实战】专栏重磅来袭！这是一份专为开发者与电商从业者打造的超详细指南。从项目基础搭建，运用 uniapp、Element Plus、SpringBoot 搭建商城框架，到用户、商品、订单等核心模块开发，再到性能优化、安全加固、多端适配&#xf…...

编程日记 2026/2/27 12:57:50

MongoDB 可观测性最佳实践

MongoDB 介绍 MongoDB 是一个高性能、开源的 NoSQL 数据库，它采用灵活的文档数据模型，非常适合处理大规模的分布式数据。MongoDB 的文档存储方式使得数据结构可以随需求变化而变化，提供了极高的灵活性。它支持丰富的查询语言，允许…...

编程日记 2026/3/1 7:24:11

论文阅读笔记——LORA: LOW-RANK ADAPTATION OF LARGE LANGUAGE MODELS

LoRA 论文传统全面微调，对每个任务学习的参数与原始模型相同： m a x Φ ∑ ( x , y ) ∈ Z ∑ t 1 ∣ y ∣ l o g ( P Φ ( y t ∣ x , y < t ) ) 式(1) max_{\Phi}\sum_{(x,y)\in Z}\sum^{|y|}_{t1}log(P_{\Phi}(y_t|x,y<t)) \qquad \text{式(…...

编程日记 2026/3/3 6:01:44

UE5中 Character、PlayerController、PlayerState、GameMode和GameState核心类之间的联动和分工·

1. GameMode 与 GameState 关系描述 GameMode：定义游戏规则和逻辑，控制游戏的开始、进行和结束。GameState：存储和同步全局游戏状态，如得分、时间、胜利条件等。联动方式 GameMode初始化GameState：GameMode在游戏…...

编程日记 2026/3/7 0:27:17

Redis的IO多路复用机制：高效的网络通信设计

在高并发、高性能的应用中，如何有效地管理和处理大量的客户端请求是一个至关重要的问题。Redis作为一个高性能的内存数据存储系统，面对大量并发客户端请求时，需要具备良好的网络通信能力。在Redis的设计中，IO多路复用机制是其核心…...

编程日记 2026/2/16 12:12:15

Ubuntu24.04 启动后突然进入tty，无法进入图形界面

问题描述昨晚在编译 Android AOSP 14 后，进入了登录页面，但出现了无法输入密码的情况，且无法正常关机，只能强制重启。重启后，系统只能进入 TTY 页面，无法进入图形界面。问题排查经过初步排查&#x…...

编程日记 2026/3/6 20:40:55

搭建主从服务器

任务需求客户端通过访问 www.nihao.com 后，能够通过 dns 域名解析，访问到 nginx 服务中由 nfs 共享的首页文件，内容为：Very good, you have successfully set up the system. 各个主机能够实现时间同步，并且都开启防…...

编程日记 2026/3/6 10:03:47

jenkins 配置邮件问题整理

版本：Jenkins 2.492.1 插件： A.jenkins自带的， B.安装功能强大的插件配置流程： 1. jenkins->系统配置->Jenkins Location 此处的”系统管理员邮件地址“，是配置之后发件人的email。 2.配置系统自带的邮件A…...

编程日记 2026/3/2 4:57:40

Scala语言的计算机基础

Scala语言的计算机基础计算机科学是一门极具挑战性和创造力的学科，其中编程语言是连接人类与计算机的桥梁。Scala（特指可扩展语言）作为一种现代编程语言，其设计初衷是为了简化软件开发过程，并结合了面向对象和函数式…...

编程日记 2026/2/15 14:53:14

1. 数据库配置 js import { Sequelize, DataTypes } from sequelize; // 创建一个 Sequelize 实例，连接到 SQLite 数据库。 export const sequelize new Sequelize(test, sa, "123456", { host: localhost, dialect: sqlite, storage: ./blog.db })…...

编程日记 2026/2/23 7:33:58

JVM中常量池和运行时常量池、字符串常量池三者之间的关系

文章目录前言常量池（Constant Pool）运行时常量池（Runtime Constant Pool）字符串常量池（String Literal Pool）运行时常量池和字符串常量池位置变化方法区与永久代和元空间的关系三者之间的关系常量池与运行…...

编程日记 2026/3/6 22:25:40

KV 缓存简介

以下是关于 KV缓存（Key-Value Cache） 的简介，涵盖其定义、原理、作用及优化意义： 1. 什么是KV缓存？ KV缓存是Transformer架构（如GPT、LLaMA等大模型）在自回归生成任务（如文本生成&…...

编程日记 2026/3/5 20:27:29

Mysql篇——SQL优化

本篇将带领各位了解一些常见的sql优化方法，学到就是赚到，一起跟着练习吧~ SQL优化准备工作准备的话我们肯定是需要一张表的，什么表都可以，这里先给出我的表结构（表名：userinfo） 通过sql查看…...

编程日记 2026/3/6 23:18:51

算法基础 -- ARM 体系架构设计专家的算法提升目标

算法提升目标:ARM 体系架构设计专家 1. 位运算优化相关 ARM 知识点：SIMD、NEON、SVE、低功耗优化、加密计算、数据压缩推荐题目： 136. 只出现一次的数字（异或运算）190. 颠倒二进制位（位反转，ARM rbit…...

编程日记 2026/2/27 15:32:17

不同开发语言对字符串的操作

一、字符串的访问 Objective-C: 使用 characterAtIndex: 方法访问字符。 NSString *str "Hello, World!"; unichar character [str characterAtIndex:0]; // 访问第一个字符 H NSLog("%C", character); // 输出: H NSString 内部存储的是 UTF-16 编…...

编程日记 2026/2/16 12:21:55

Oracle Linux Server 7.9安装fail2ban

yum search oracle-epel-release yum install oracle-epel-release-el7 search fail2ban yum install fail2ban nano /etc/fail2ban/jail.d/00-firewalld.conf # defalut这里是设定全局设置，如果下面的监控没有设置就以全局设置的值设置。 [DEFAULT] # 用于指定哪…...

编程日记 2026/2/16 12:23:35

FPGA|Verilog-SPI驱动

最近准备蓝桥杯FPGA的竞赛，因为感觉官方出的IIC的驱动代码思路非常好，写的内容非常有逻辑并且规范。也想学习一下SPI的协议，所以准备自己照着写一下。直到我打开他们给出的SPI底层驱动，我整个人傻眼了，我只能说&#x…...

编程日记 2026/2/25 23:21:48

Windows11 新机开荒（二）电脑优化设置

目录前言： 一、注册微软账号绑定权益二、此电脑桌面图标三、系统分盘及默认存储位置更改 3.1 系统分盘 3.2 默认存储位置更改四、精简任务栏总结： 前言： 本文承接上一篇新机开荒（一） 上一篇文章地址&…...

编程日记 2026/3/3 6:34:09

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

1、引言 DeepSeek R1 采用了混合专家（Mixture of Experts，MoE）架构，包含多个专家子网络，并通过一个门控机制动态地激活最相关的专家来处理特定的任务。DeepSeek R1 总共有 6710 亿个参数，但在每个前向传播…...

编程日记 2026/2/27 17:15:33

揭秘大数据 | 9、大数据从何而来？

在科技发展史上，恐怕没有任何一种新生事物深入人心的速度堪比大数据。如果把2012年作为数据量爆发性增长的第一年，那么短短数年，大数据就红遍街头巷尾——从工业界到商业界、学术界，所有的行业都经受了大数据的洗礼。从技术的迭…...

编程日记 2026/3/6 20:51:22

使用Dependency Walker和Beyond Compare快速排查dll动态库损坏或被篡改的问题

目录 1、问题描述 2、用Dependency Walker工具打开qr.dll库，查看库与库的依赖关系以及接口调用情况，定位问题 3、使用Beyond Compare工具比较一下正常的msvcr100d.dll和问题msvcr100d.dll的差异 4、最后 C软件异常排查从入门到精通系列教程&#xff…...

编程日记 2026/2/15 1:28:44

3.14学习总结排序算法

插入排序： 1.直接插入排序维护一个有序区，把元素一个个插入有序区的适当位置，直到所有元素都有序为止。 for (int i 0;i < n - 1;i) {//升序int end i;int temp k[end 1];while (end > 0) {if (temp < k[end]) {k[end 1] …...

编程日记 2025/12/25 4:02:43

Hadoop、Spark、Flink Shuffle对比

一、Hadoop的shuffle 前置知识： Map任务的数量由Hadoop框架自动计算，等于分片数量，等于输入文件总大小 / 分片大小，分片大小为HDFS默认值128M，可调 Reduce任务数由用户在作业提交时通过Job.setNumReduceTasks(int)设…...

编程日记 2026/2/27 17:21:40

本地部署 RAGFlow - 修改默认端口

本地部署 RAGFlow - 修改默认端口 1. 前提条件2. 部署 RAGFlow 1. 前提条件确保 vm.max_map_count 不小于 262144： 如需确认 vm.max_map_count 的大小： sysctl vm.max_map_count如果 vm.max_map_count 的值小于 262144，可以进行重置&…...

编程日记 2026/2/27 20:53:39