Tailwind CSS v4 主题化实践入门（自定义 Theme + 主题模式切换）✨
ok，经过学习Tailwindcss我决定将此专栏建设成为一个Tailwindcss实战专栏，我将在专栏内完成
5050挑战：50天50个Tailwindcss练习项目，欢迎大家订阅！！！
Tailwind CSS v4 带来了更强大的主题定制能力，给了前端开发者更加灵活的设计空间。
今天，我们将来学习 Tailwind CSS v4 的主题相关特性，并且给出一套实践模板 🚀
主题相关核心 API 介绍
Tailwind v4 主题使用 @theme 定义，并支持直接使用 CSS 变量来简化主题设计。下面是官方文档链接：
- 主题变量
- 添加自定义样式
- 函数和指令
下面介绍集中常见的主题相关的指令以及自定义变体。
1. @theme 元素
Tailwind v4 引入 @theme 用来定义 CSS 变量，与v3版本需要在 tailwind.config.js 里配置相比，更为简洁统一。
@theme {--color-primary: var(--primary);--radius-md: calc(var(--radius) - 2px);
}
2. @custom-variant
Tailwind v4 支持自定义优先级，实现更灵活的 dark mode 、 sidebar mode 等 UI 体验的切换。
@custom-variant dark (&:is(.dark *));
定义了一个名为 dark 的自定义变体，它会匹配所有带有 .dark 类的元素内部的所有元素。
3. @layer
虽然 Tailwind 能满足大部分样式需求，但有时候还是需要编写纯 CSS。这时，@layer指令就登场了！
- 使用
@layer指令告诉 Tailwind 一组自定义样式属于哪个bucket。有效图层为base、components和utilities。- 三个图层的生效顺序是不一致的，作用在同一元素上的相同的样式属性，生效优先级顺序是：
utilities>components>base
- 三个图层的生效顺序是不一致的，作用在同一元素上的相同的样式属性，生效优先级顺序是：
- 使用
@apply将任何现有工具类内联到你自己的自定义 CSS 中 - 你仍然可以在你的css文件中写出任何原生的css样式，但是通常不建议这么做，这会增加维护难度。
@layer base {body {@apply bg-background text-foreground;}
}@layer components {card {@apply bg-card text-card-foreground;}
}@layer utilities {.heading {@apply text-4xl font-bold;}
}
利用Theme 实现主题切换
我们可以通过 :root 和 .dark 样式规则来分别定义不同主题模式下的 变量 值，然后配合 @theme 以及 自定义变体 展开 Tailwind 内部设计。
@custom-variant dark (&:is(.dark *));@theme {--color-background: var(--background);--color-foreground: var(--foreground);--color-card: var(--card);--color-card-foreground: var(--card-foreground);--color-popover: var(--popover);--color-popover-foreground: var(--popover-foreground);--color-primary: var(--primary);--color-primary-foreground: var(--primary-foreground);--color-secondary: var(--secondary);--color-secondary-foreground: var(--secondary-foreground);--color-muted: var(--muted);--color-muted-foreground: var(--muted-foreground);--color-accent: var(--accent);--color-accent-foreground: var(--accent-foreground);--color-destructive: var(--destructive);--color-destructive-foreground: var(--destructive-foreground);--color-border: var(--border);--color-input: var(--input);--color-ring: var(--ring);--color-chart-1: var(--chart-1);--color-chart-2: var(--chart-2);--color-chart-3: var(--chart-3);--color-chart-4: var(--chart-4);--color-chart-5: var(--chart-5);--radius-sm: calc(var(--radius) - 4px);--radius-md: calc(var(--radius) - 2px);--radius-lg: var(--radius);--radius-xl: calc(var(--radius) + 4px);--color-sidebar: var(--sidebar);--color-sidebar-foreground: var(--sidebar-foreground);--color-sidebar-primary: var(--sidebar-primary);--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);--color-sidebar-accent: var(--sidebar-accent);--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);--color-sidebar-border: var(--sidebar-border);--color-sidebar-ring: var(--sidebar-ring);
}:root {--background: oklch(1 0 0);--foreground: oklch(0.145 0 0);--card: oklch(1 0 0);--card-foreground: oklch(0.145 0 0);--popover: oklch(1 0 0);--popover-foreground: oklch(0.145 0 0);--primary: oklch(0.205 0 0);--primary-foreground: oklch(0.985 0 0);--secondary: oklch(0.97 0 0);--secondary-foreground: oklch(0.205 0 0);--muted: oklch(0.97 0 0);--muted-foreground: oklch(0.556 0 0);--accent: oklch(0.97 0 0);--accent-foreground: oklch(0.205 0 0);--destructive: oklch(0.577 0.245 27.325);--destructive-foreground: oklch(0.577 0.245 27.325);--border: oklch(0.922 0 0);--input: oklch(0.922 0 0);--ring: oklch(0.708 0 0);--chart-1: oklch(0.646 0.222 41.116);--chart-2: oklch(0.6 0.118 184.704);--chart-3: oklch(0.398 0.07 227.392);--chart-4: oklch(0.828 0.189 84.429);--chart-5: oklch(0.769 0.188 70.08);--radius: 0.625rem;--sidebar: oklch(0.985 0 0);--sidebar-foreground: oklch(0.145 0 0);--sidebar-primary: oklch(0.205 0 0);--sidebar-primary-foreground: oklch(0.985 0 0);--sidebar-accent: oklch(0.97 0 0);--sidebar-accent-foreground: oklch(0.205 0 0);--sidebar-border: oklch(0.922 0 0);--sidebar-ring: oklch(0.708 0 0);
}.dark {--background: oklch(0.145 0 0);--foreground: oklch(0.985 0 0);--card: oklch(0.145 0 0);--card-foreground: oklch(0.985 0 0);--popover: oklch(0.145 0 0);--popover-foreground: oklch(0.985 0 0);--primary: oklch(0.985 0 0);--primary-foreground: oklch(0.205 0 0);--secondary: oklch(0.269 0 0);--secondary-foreground: oklch(0.985 0 0);--muted: oklch(0.269 0 0);--muted-foreground: oklch(0.708 0 0);--accent: oklch(0.269 0 0);--accent-foreground: oklch(0.985 0 0);--destructive: oklch(0.396 0.141 25.723);--destructive-foreground: oklch(0.637 0.237 25.331);--border: oklch(0.269 0 0);--input: oklch(0.269 0 0);--ring: oklch(0.439 0 0);--chart-1: oklch(0.488 0.243 264.376);--chart-2: oklch(0.696 0.17 162.48);--chart-3: oklch(0.769 0.188 70.08);--chart-4: oklch(0.627 0.265 303.9);--chart-5: oklch(0.645 0.246 16.439);--sidebar: oklch(0.205 0 0);--sidebar-foreground: oklch(0.985 0 0);--sidebar-primary: oklch(0.488 0.243 264.376);--sidebar-primary-foreground: oklch(0.985 0 0);--sidebar-accent: oklch(0.269 0 0);--sidebar-accent-foreground: oklch(0.985 0 0);--sidebar-border: oklch(0.269 0 0);--sidebar-ring: oklch(0.439 0 0);
}
... 其他主题样式
最佳实践：切换主题按钮组件
下面是我创建的用于切换主题的按钮组件，大家可以参考一下：
<template><button@click="toggleTheme"class="flex items-center gap-2 rounded bg-gray-200 px-4 py-2 text-gray-800 transition-colors duration-300 hover:bg-gray-300 dark:bg-gray-700 dark:text-gray-100 dark:hover:bg-gray-600"><span v-if="isDark">🌙 暗黑</span><span v-else>☀️ 亮色</span></button>
</template><script setup>import { ref, onMounted } from 'vue'const isDark = ref(false)const toggleTheme = () => {isDark.value = !isDark.valuedocument.documentElement.classList.toggle('dark')localStorage.setItem('theme', isDark.value ? 'dark' : 'light')}onMounted(() => {const theme = localStorage.getItem('theme')isDark.value = theme === 'dark'if (isDark.value) {document.documentElement.classList.add('dark')}})
</script>其他
当然tailwindcss v4支持丰富的 自定义样式 复杂样式 以及 自定义变体，今天们探讨一些常用的主题配置和规则。
Tailwind CSS v4 主题相关引入，让你从分散的属性处理升级到全局统一。
相关文章：
Tailwind CSS v4 主题化实践入门（自定义 Theme + 主题模式切换）✨
ok，经过学习Tailwindcss我决定将此专栏建设成为一个Tailwindcss实战专栏，我将在专栏内完成5050挑战：50天50个Tailwindcss练习项目，欢迎大家订阅！！！ Tailwind CSS v4 带来了更强大的主题定制能力…...
[C++] 大数减/除法
目录 高精度博客 - 前两讲高精度减法高精度除法高精度系列函数完整版 高精度博客 - 前两讲 讲次名称链接高精加法[C] 高精度加法(作用 模板 例题)高精乘法[C] 高精度乘法 高精度减法 void subBIG(int x[], int y[], int z[]){z[0] max(x[0], y[0]);for(int i 1; i < …...
数据链共享：从印巴空战到工业控制的跨越性应用
摘要 本文通过对印巴空战中数据链共享发挥关键作用的分析，引出数据链共享在工业控制领域同样具有重大价值的观点。深入阐述 DIOS 工业控制操作系统作为工业数据链共享基础技术的特点、架构及应用优势，对比空战场景与工业控制场景下数据链共享的相…...
加速pip下载：永久解决网络慢问题
一文教你解决 pip 下载太慢了的问题 || 下载时因为网络不好中断下载的问题 一、找到 pip 配置文件路径 1.配置文件位置： Windows 系统的 pip 配置文件默认不存在，需要手动创建，路径为： C:\Users\你的用户名\pip\pip.ini 用户目…...
无线网络设备中AP和AC是什么？有什么区别？
无线网络设备中AP和AC是什么？有什么区别？ 一. 什么是AP？二. 什么是AC？三. AP与AC的关系 前言 肝文不易，点个免费的赞和关注，有错误的地方请指出，看个人主页有惊喜。 作者：神的孩子都…...
软考中级数据库备考-上午篇
背景 新工作主要做大数据平台，考一个软考中级数据库系统工程师，补足一下基础知识。 基础知识 1.计算机硬件基础知识 正确答案:C 正确答案:D 正确答案:C 正确答案：BC 正确答案：B 正确答案:D 正确答案:A DMA建立内存与外设的直接…...
opencv处理图像（二）
接下来进入到程序线程设计部分 我们主线程负责图形渲染等操作，OpenGL的限制，opencv技术对传入图像加以处理，输出预期图像给主线程 QThread 我之前也是在想给opencv开一个专门的线程，但经过了解有几个弊端，第一资源浪…...
powerbuilder9.0中文版
经常 用这个版本号写小软件,非常喜欢这个开发软件 . powerbuilder9.0 非常的小巧,快捷,功能强大,使用方便. 我今天用软件 自己汉化了一遍，一些常用的界面都已经翻译成中文。 我自己用的，以后有什么界面需要翻译，再更新一下。 放在这里留个…...
Linux510 ssh服务 ssh连接
arning: Permanently added ‘11.1.1.100’ (ECDSA) to the list of known hosts. rooot11.1.1.100’s password: Permission denied, please try again. rooot11.1.1.100’s password: Permission denied, please try again 还没生效 登不上了 失效了 sshcaozx26成功登录 …...
信息加密技术)
【25软考网工】第六章(2)信息加密技术
博客主页： christine-rr-CSDN博客 专栏主页： 软考中级网络工程师笔记 大家好，我是christine-rr !目前《软考中级网络工程师》专栏已经更新二十多篇文章了，每篇笔记都包含详细的知识点，希望能帮助到你！…...
LeetCode 热题 100 138. 随机链表的复制
LeetCode 热题 100 | 138. 随机链表的复制 大家好，今天我们来解决一道经典的链表问题——随机链表的复制。这道题在 LeetCode 上被标记为中等难度，要求深拷贝一个带有随机指针的链表。 问题描述 给你一个长度为 n 的链表，每个节点包含一个额…...
差动讯号（3）弱耦合与强耦合
各位在设计高速差动对时，除了阻抗之外，可能还会被问到一个问题，P与N之间的间距要多少？ 在差动讯号（2）：奇模与偶模一文中，我们已经知道差动对两线间距会影响其特性阻抗，且…...
强化学习系列：深度强化学习和DQN
1. 往期回顾 介绍了强化学习的基本概念和基本原理 介绍了基于动态规划的传统强化学习——价值迭代、策略迭代 介绍了在无模型的环境下，基于时序差分的表格型强化学习——Q-learning、SARSA 这些传统的方法都有各自的局限性，能适用的范围有限…...
AlimaLinux设置静态IP
通过nmcli命令来操作 步骤 1：确认当前活动的网络接口名称 首先，需要确认当前系统中可用的网络接口名称。可以使用以下命令查看： nmcli device步骤 2：修改配置以匹配正确的接口名称 sudo nmcli connection modify ens160 ipv4.…...
神经网络极简入门技术分享
1. 引言 神经网络是深度学习的基础，其设计灵感来源于人脑神经元的结构和工作方式。尽管现代神经网络已经变得异常复杂，但其核心原理却相对简单易懂。本报告旨在通过剖析神经网络的最基本单元——神经元，帮助初学者理解神经网络的工作原理。 …...
使用定时器监视当前PID 如果当前程序关闭 UI_Core.exe 也随之自动关闭实现方法
使用定时器监视当前PID 如果当前程序关闭 UI_Core.exe 也随之自动关闭实现方法 描述: C20 QT6.9 VS2022 中使用QProcess::startDetached(“UI_Core.exe”, QStringList(), QString(), &UI_Manage_pid);是启动目标程序 能否同时告诉目标程序当前宿主程序的PID,在UI_CORE.EX…...
SpringCloud之Ribbon基础认识-服务负载均衡
0、Ribbon基本认识 Spring Cloud Ribbon 是基于 Netflix Ribbon 实现的一套客户端 负载均衡的工具。 Ribbon 主要功能是提供客户端负载均衡算法和服务调用 Ribbon 客户端组件提供一系列完善的配置项如连接超时，重试等。 Ribbon 会基于某种规则（如简单…...
leetcode0829. 连续整数求和-hard
1 题目： 连续整数求和 官方标定难度：难 给定一个正整数 n，返回 连续正整数满足所有数字之和为 n 的组数 。 示例 1: 输入: n 5 输出: 2 解释: 5 2 3，共有两组连续整数([5],[2,3])求和后为 5。 示例 2: 输入: n 9 输出: …...
Python-77：古生物DNA序列血缘分析
问题描述 小U是一位古生物学家，正在研究不同物种之间的血缘关系。为了分析两种古生物的血缘远近，她需要比较它们的DNA序列。DNA由四种核苷酸A、C、G、T组成，并且可能通过三种方式发生变异：添加一个核苷酸、删除一个核苷酸或替换一…...
数据结构算法习题通关：树遍历 / 哈夫曼 / 拓扑 / 哈希 / Dijkstra 全解析
已知一棵二叉树先序遍历和中序遍历分别为 ABDEGCFH 和 DBGEACHF，请画出这个二叉树的逻辑结构并写出后序遍历的序列。 先序遍历：ABDEGCFH 中序遍历：DBGEACHF 先序遍历看出根为A，左子树DBGE，右子树CHF A的左子树 再…...
使用lldb查看Rust不同类型的结构
目录 前言 正文 标量类型 复合类型——元组 复合类型——数组 函数 &str struct 可变数组vec Iter String Box Rc Arc RefCell Mutex RwLock Channel 总结 前言 笔者发现这个lldb挺好玩的，可以查看不同类型的结构，虽然这好像是C的东…...
M0的基础篇之PWM学习
一、困惑 上一节课就是单纯的之配置了一个基础的定时器进行计数，计到一定的数值也就是到了一定的时间就进入中断，执行中断里面的任务，也就是一个最基础的定时的功能 这一节课的定时器产生了一个pwm波。也就是我们可以改变里面高电平的持续时间…...
win10-启动django项目时报错
前提 win10系统下已经安装了pip 和django（因为搜报错解决办法的时候，有博客说先检查下django有没有安装），另外也没有安装anaconda，没有用虚拟环境 报错如下 在pycharm执行新建app的命令python mange.py startapp app02…...
coze工作流完成行业调研报告
一、coze 是什么？ Coze是由字节跳动推出的新一代AI应用开发平台，定位是零代码或低代码的AI开发平台，也被称为字节跳动版的GPTs ，国内版名为“扣子”。 Coze有国内版和国外版两个版本。国内版网址为http://www.coze.cn ÿ…...
为什么有了BST了，还要红黑树，红黑树有什么优点
BST（二叉搜索树）和红黑树都是常见的树形数据结构，但红黑树在某些方面对BST进行了优化，主要解决了BST在特定情况下可能出现的性能问题。以下是红黑树的核心优点及其存在的必要性： BST的局限性 BST的时间复杂度与树的高…...
【Linux基础】网络相关命令
目录 netstat命令 1.1 命令介绍 1.2 命令格式 1.3 常用选项 1.4 常用命令实例 1.4.1 显示所有TCP连接 1.4.2 查看路由表 1.4.3 实时监控网络接口流量 1.4.4 查看监听中的端口以及关联进程 ping命令 2.1 命令介绍 2.2 命令格式 2.3 常用选项 2.4 常用示例 ifconfi…...
DB4S：一个开源跨平台的SQLite数据库管理工具
DB Browser for SQLite（DB4S）是一款开源、跨平台的 SQLite 数据库管理工具，用于创建、浏览和编辑 SQLite 以及 SQLCipher 数据库文件。 功能特性 DB4S 提供了一个电子表格风格的数据库管理界面，以及一个 SQL 查询工具。DB4S 支持…...
多个python环境下，pip安装无法成功解决方案
问题 使用pip install xxx，安装过程很顺利且无任何报错，但是一旦在python中import xxx时，仍然提示xxx不存在。 解决方案 首先排除掉xxx包命名是否正确—— 这个非本文重点。 当已经确认xxx包命名正确，且常规通过pip install 即…...
人脸真假检测：SVM 与 ResNet18 的实战对比
在人工智能蓬勃发展的当下，人脸相关技术广泛应用于安防、金融、娱乐等诸多领域。然而，随着人脸合成技术的日益成熟，人脸真假检测成为保障这些应用安全的关键环节。本文将深入探讨基于支持向量机（SVM）结合局部二值模式&…...
求数组中的两数之和--暴力/哈希表
暴力法太好用了hhhhhhhhhhhhhhhhhhh我好爱鹅鹅鹅鹅鹅鹅呃呃呃呃呃呃呃呃呃呃 #include <iostream> #include <vector> using namespace std; int main(){ int n,target; cin>>n>>target; vector<int> nums(n); for(int i0;i<n;i){ cin>>…...
Go多服务项目结构优化：为何每个服务单独设置internal目录？
文章目录 Go多服务项目结构优化：为何每个服务单独设置internal目录？背景什么是 Go 的 internal 机制？传统根 internal 目录的局限为什么要每个服务单独设置 internal ？推荐结构示例 总结 Go多服务项目结构优化：为何每个…...
Wallcraft 3.53.0 | 提供高质量动态4D壁纸，解锁高级版，无广告干扰
Wallcraft是一款专注于提供高质量、原创壁纸的应用程序，特别是其特色的动态4D壁纸。这款应用程序不仅提供了大量免费的4K超高清壁纸和炫酷背景，还特别推出了带有视差效果的动态超高清4K壁纸及视频壁纸。用户可以根据个人喜好选择并设置这些壁纸作为手机屏…...
akshare爬虫限制，pywencai频繁升级个人做量化，稳定数据源和券商的选择
做量化，数据和交易接口是策略和自动化交易的基石，而稳定的数据和快人一步的交易接口是个人做量化的催化剂。 之前写过一篇文章：个人做量化常用的数据，多以爬虫为主，最近akshare爬虫限制，pywencai频繁升级。…...
leetcode504.七进制数
标签：进制转换 机试真题 给定一个整数 num，将其转化为 7 进制，并以字符串形式输出。 示例 1: 输入: num 100 输出: "202" 示例 2: 输入: num -7 输出: "-10" 思路：求n进制就是循环取余数，…...
OpenAI 结构改革：迈向民主化 AI 的新篇章
每周跟踪AI热点新闻动向和震撼发展 想要探索生成式人工智能的前沿进展吗？订阅我们的简报，深入解析最新的技术突破、实际应用案例和未来的趋势。与全球数同行一同，从行业内部的深度分析和实用指南中受益。不要错过这个机会，成为AI领…...
Satori：元动作 + 内建搜索机制，让大模型实现超级推理能力
Satori：元动作 内建搜索机制，让大模型实现超级推理能力 论文大纲一、背景：LLM 推理增强的三类方法1. 基于大规模监督微调（SFT）的推理增强2. 借助外部机制在推理时进行搜索 (RLHF / 多模型 / 工具)3. 现有局限性总结 二…...
Python序列化的学习笔记
1. Npy&Numpy O4-mini-Cursor：如果.npy文件里包含了「Python对象」而非纯数值数组时，就必须在加载时加上allow_pickleTrue。...
如何修改进程优先级？
文章目录 1. 摘要2. 命令实现2.1 使用 renice（调整普通进程的优先级）2.2 使用 chrt（调整实时进程的优先级） 3. 代码实现 1. 摘要 在实际开发中，我们经常会遇到创建进程的场景，但是往往并不关心它的优先级…...
java命令行打包class为jar并运行
1.创建无包名类： 2.添加依赖jackson 3.引用依赖包 4.命令编译class文件 生成命令： javac -d out -classpath lib/jackson-core-2.13.3.jar:lib/jackson-annotations-2.13.3.jar:lib/jackson-databind-2.13.3.jar src/UdpServer.java 编译生成class文件如下 <...
JAVA自动装箱拆箱
引言 Java 中的**装箱（Boxing）和拆箱（Unboxing）**是自动类型转换的机制，用于在基本数据类型（如 int、long 等）和其对应的包装类（如 Integer、Long 等）之间进行转换。这种…...
Linux系统之----模拟实现shell
在前面一个阶段的学习中，我们已经学习了环境变量、进程控制等等一系列知识，也许有人会问，学这个东西有啥用？那么，今天我就和大家一起综合运用一下这些知识，模拟实现下shell！ 首先我们来看一看我…...
Doris和Clickhouse对比
目录 一、Doris和Clickhouse对比**1. 底层架构****Doris****ClickHouse** **2. 运行原理****Doris****ClickHouse** **3. 使用场景****Doris****ClickHouse** **4. 优缺点对比****总结** 二、MPP架构和Shared-Nothing 架构对比**1. 什么是 MPP 架构？****定义****特点…...
思考：（linux） tmux 超级终端快速入门的宏观思维
tmux 工具集合 GitHub - rothgar/awesome-tmux: A list of awesome resources for tmux 要点： 习惯性思维的变换与宿主机之间的双向复制、粘贴手动备份全部窗口，以及还原自定义窗格提示信息TPM 插件的安装思想别名 在有些场景里，可能无法…...
JavaScript基础-全局作用域
在JavaScript中，理解不同种类的作用域是掌握这门语言的关键之一。作用域决定了变量和函数的可访问性（即可见性和生命周期）。其中，全局作用域是最基本也是最宽泛的作用域类型。本文将深入探讨全局作用域的概念、特点及其使用时需要…...
【MCAL】TC397+EB-tresos之I2c配置实战（同步、异步）
I2C总线是Philips公司在八十年代初推出的一种串行、半双工的总线，主要用于近距离、低速的芯片之间的通信。本篇文章首先从理论讲起，介绍了英飞凌TC3x系列芯片对应MCAL中对I2C驱动的定义与介绍，建议读者在阅读本篇文章之前对I2C有个简单的认识…...
电网拓扑分析：原理与应用
在现代电力系统中，电网拓扑分析是一项至关重要的技术，它为电力系统的安全、稳定和高效运行提供了坚实的基础。电网拓扑描述了电力系统中各元件（如发电机、变压器、输电线路、负荷等）之间的连接关系，通过拓扑分析&#…...
leetcode-hot-100（哈希）
写在前面 这部分官方标记为哈希，下面的代码使用的都是 C 进行实现，说到 C 中的哈希，需要了解一下 C 中的 hashtable（std::unordered_map或std::unordered_set）。 std::unordered_map std::unordered_map 是一个存储…...
音频类网站或者资讯总结
我爱音频网： 我爱音频网 - 我们只谈音频，丰富的TWS真无线蓝牙耳机拆解报告 (52audio.com) 其他更多资讯 音频行业全品类深度剖析，2024市场趋势解读汇总-EDN 电子技术设计 (ednchina.com)...
优选算法——前缀和
目录 1. 数组的中心下标 2. 除自身以外数组的乘积 3. 和为k的子数组 4. 和可被K整除的子数组 5. 连续数组 6. 矩阵区域和 1. 数组的中心下标 题目链接：724. 寻找数组的中心下标 - 力扣（LeetCode） 题目展示： 题目分析&am…...
VScode密钥（公钥，私钥）实现免密登录【很细，很全，附带一些没免密登录成功的一些解决方法】
一、 生成SSH密钥对 ssh-keygen 或者 ssh-keygen -t rsa -b 4096区别：-t rsa可以明确表示生成的是 RSA 类型的密钥-b参数将密钥长度设置为 4096 位默认：2048 位密钥不指定-t参数，ssh -keygen默认也可能生成 RSA 密钥【确保本机安装ssh&#…...