CSDN博客:Markdown编辑语法教程总结教程(下)

折枝寄北
❤个人主页:折枝寄北的博客

前封

Markdown编辑语法教程总结

  • 前言
  • 1. LaTex数学公式
  • 2. 插入不同类别的图
    • 2.1 插入甘特图
    • 2.2 插入UML图
    • 2.3 插入Mermaid流程图
    • 2.4 插入Flowchart流程图
    • 2.5 插入classDiagram类图
  • 3. CSDN快捷键
  • 4. 字体相关设置
    • 4.1 字体样式改变
    • 4.2 字体大小改变
    • 4.3 字体颜色改变
    • 4.4 字体背景色实现
  • 感谢您的阅读支持!!!
  • 后续会持续更新的!!!
  • 文末投票支持一下!!!

前言

在如今这个信息爆炸的时代,知识的分享与传播变得尤为重要,而博客无疑是其中的关键载体之一。CSDN作为国内知名的技术社区平台,为无数技术爱好者提供了展示自我、交流学习的空间。在使用 CSDN 博客进行创作的过程中,Markdown 编辑器无疑是提升写作效率、打造美观文章格式的得力工具。

回首过往,我初涉博客创作领域时,面对Markdown编辑器也是一头雾水。那些看似简单的符号和规则,仿佛是一道难以逾越的门槛,让我在创作过程中走了不少弯路。但凭借着对知识分享的热情和坚持不懈的探索,我逐渐掌握了 Markdown 编辑器的精髓,体会到了它为写作带来的便捷与高效。

如今,我将自己在学习 CSDN Markdown 编辑语法过程中的经验与心得进行总结,整理成这篇教程。希望能为那些和曾经的我一样,对 Markdown 编辑器感到迷茫的新手朋友们提供一份清晰的学习指南,让大家能够快速上手 CSDN Markdown编辑器,专注于优质内容的创作,轻松打造出排版精美的博客文章,在知识分享的道路上更加顺畅地前行。

在这篇博客之前,我已经写了上篇和中篇,在上篇中有“基础介绍,创作助手,目录,标题和文本样式”的使用介绍;在中篇中介绍了列表,图片,链接,代码片,表格,注脚和注释。有需要的朋友可以去看看!!!
CSDN博客:Markdown编辑语法教程总结教程(上)
CSDN博客:Markdown编辑语法教程总结教程(中)

1. LaTex数学公式

不建议使用,想要熟练使用所需的时间较长,适用于专业的文章中使用,在一般的博客中插入相关图片来阅读观看已经足够使用。

通过这个网址可以学习,新手建议先不要使用,上手较难,等能力跟上,在进行补充。

https://khan.github.io/KaTeX/
在这里插入图片描述

CSDN给出的示例:

Gamma公式展示 Γ ( n ) = ( n − 1 ) ! ∀ n ∈ N \Gamma(n) = (n-1)!\quad\forall n\in\mathbb N Γ(n)=(n1)!nN 是通过 Euler
integral

Γ ( z ) = ∫ 0 ∞ t z − 1 e − t d t . \Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,. Γ(z)=0tz1etdt.

最终效果:
在这里插入图片描述

2. 插入不同类别的图

不建议使用,熟练使用所需的时间较长且使用频率较低,一般不进行使用,效果同样可以使用插入普通图片来实现效果,而且更为方便直接。

2.1 插入甘特图

简介:甘特图(Gantt Chart)又称为横道图、条状图,是以提出者亨利·甘特的名字命名的一种直观的可视化工具,用于展示项目进度、任务安排等信息。

主要特点
时间导向 :以时间为横轴,清晰展示各项任务在不同时间段的安排。 任务展示
:以纵轴列出具体任务或活动,通过横轴上的条形长度和位置,直观呈现任务的持续时间、开始时间和结束时间等信息。 进度可视化
:能直观地看出各项任务的进展情况,便于管理者及时掌握项目整体进度。

常见应用场景
项目管理 :帮助项目经理合理安排项目任务,明确任务顺序和时间要求,有效监控项目进度,及时发现并解决进度偏差等问题。 生产计划
:在生产制造领域,用于制定生产计划,安排不同产品的生产任务,确保生产过程按计划有序推进。 工程建设
:如建筑工程项目中,用于规划工程进度,安排基础施工、主体施工、装修等各个环节的时间和资源投入。 常用制作工具

Microsoft Project :专业的项目管理软件,具备强大的甘特图制作和管理功能,能够方便地调整任务时间、设置任务关联等。
Excel :通过数据处理和图表功能,可以制作简单的甘特图,适合小型项目或临时性的任务安排。 在线项目管理工具 :如
Trello、Asana 等,提供了便捷的甘特图制作模板和功能,方便团队协作和项目进度共享。

具体参考文档进行学习

参考文档:(https://mermaid-js.github.io/mermaid/#/gantt)

示例:

2014-01-06 2014-01-07 2014-01-08 2014-01-09 2014-01-10 2014-01-11 2014-01-12 2014-01-13 2014-01-14 2014-01-15 2014-01-16 2014-01-17 已完成 进行中 计划中 现有任务 Adding GANTT diagram functionality to mermaid

在这里插入图片描述

2.2 插入UML图

简介:UML(Unified Modeling Language)图,即统一建模语言图,是一种标准化的建模工具,广泛应用于软件工程、系统设计等领域,用于可视化、详述、构造和文档化系统的设计过程。

主要特点
可视化表达 :通过各种图形元素(如矩形、椭圆形、箭头等)和连接关系,将系统的组成部分及其相互关系以直观的方式呈现出来,便于理解和沟通。
多角度描述:从不同的视角和层次对系统进行建模,包括静态结构、动态行为、系统组件等方面,全面展示系统的特性。
标准化规范:具有一套统一的符号和语义规范,使得不同人员在使用 UML 图进行建模时,能够保持一致的表达方式和理解,便于团队协作和知识共享。

常见类型
结构图 类图(Class Diagram) :展示系统的类、接口及其之间的关系,如继承、关联、聚合等,是描述系统静态结构的核心图。
对象图(Object Diagram) :显示系统在某一特定时刻的对象实例及其关联关系,是对类图的一个示例化展示。
组件图(Component Diagram) :描绘系统的组件及其之间的依赖关系,组件可以是代码库、动态链接库等可替代的物理实现部分。
部署图(Deployment Diagram) :展示系统硬件节点以及在节点上部署的软件构件,用于描述系统的物理架构和部署情况。 行为图
用例图(Use Case Diagram) :从用户角度出发,展示系统功能(用例)以及参与者(如用户、外部系统等)与系统功能之间的交互关系。
活动图(Activity Diagram) :描述系统的业务流程、工作流或操作的执行步骤,展示从开始到结束的活动顺序及分支、并发等情况。
状态图(State Diagram) :刻画系统中某一类对象的状态及其之间的转移关系,适用于描述具有明显状态变化和事件驱动行为的对象。
顺序图(Sequence Diagram) :以时间和顺序为轴,展示对象之间的交互顺序和消息传递,直观呈现系统动态行为的时间序列。
通信图(Communication Diagram)
:侧重于展示对象之间的关联关系及消息传递,以对象和关联为图的轴线,强调对象之间的交互连接。

常用制作工具 专业建模工具 :

Enterprise Architect、Visual Paradigm 等,具备强大的 UML 建模功能,支持所有类型的 UML
图制作,且提供丰富的模板和自定义选项。 办公软件 :Microsoft Visio 也常用于绘制 UML
图,通过其形状库和连接工具,可以方便地创建各类 UML 图形。 在线工具 :如 draw.io、Lucidchart 等,提供了简洁易用的 UML 图制作界面和基本的图形元素,适合快速绘制简单的 UML 图,便于在线协作和分享。

应用场景
软件开发:在软件系统的设计阶段,帮助开发团队梳理需求、设计系统架构和模块划分,指导代码编写和系统实现。
系统分析与设计:用于对现有系统进行分析和建模,发现系统中的问题和改进点,为系统优化和升级提供依据。
项目管理:辅助项目团队进行项目规划、任务分解和进度跟踪,通过 UML 图展示项目的整体结构和各任务之间的依赖关系。
业务流程梳理 :对企业或组织的业务流程进行可视化建模,帮助业务人员和开发人员共同理解业务规则和流程,为信息化建设提供业务基础。

具体参考文档进行学习

参考文档:(https://mermaid-js.github.io/mermaid/#/sequenceDiagram)

示例:

张三 李四 王五 你好!李四, 最近怎么样? 你最近怎么样,王五? 我很好,谢谢! 我很好,谢谢! 李四想了很长时间, 文字太长了 不适合放在一行. 打量着王五... 很好... 王五, 你怎么样? 张三 李四 王五

2.3 插入Mermaid流程图

简介:Mermaid流程图是一种基于文本的图表绘制工具,它允许用户通过简单的文本语法来创建和修改各种类型的图表,包括流程图、序列图、甘特图、类图、状态图等。以下是关于Mermaid流程图的详细介绍:

核心特点
文本驱动的图表生成:通过类似Markdown的语法,用户可以使用纯文本描述来创建图表,这种方式易于学习和使用,且便于版本管理和协作。
跨平台兼容:Mermaid可以在任何支持JavaScript的环境中运行,包括网页、Markdown编辑器、笔记应用等,具有良好的跨平台特性。
动态修改:图表可以通过修改其描述来重新渲染和修改,这使得它在文档编写和项目管理中非常灵活。
多种图表支持:除了流程图,Mermaid还支持序列图、类图、状态图、甘特图等多种图表类型,满足不同场景的需求。
开源与社区支持:作为开源项目,Mermaid拥有活跃的社区,持续更新和改进,用户可以获取丰富的资源和支持。

具体参考文档进行学习

参考文档:(https://mermaid-js.github.io/mermaid/#/flowchart?id=graph)

示例:

链接
长方形
圆角长方形
菱形

2.4 插入Flowchart流程图

简介:流程图是一种通过图形化方式展示算法、工作流程或业务流程的工具。它使用一系列标准化的图形和符号来表示不同的操作、决策点、数据流等,并通过箭头连接这些图形来表示流程的顺序和逻辑关系。

常用图形及意义
椭圆形:表示流程的开始或结束,通常用于流程的起点和终点。 矩形:表示具体的处理步骤或操作,是流程图中最常用的图形。
菱形:表示决策点,用于需要根据条件进行判断的地方,通常会有多个分支。 平行四边形:表示输入或输出操作,如数据的读取或结果的输出。
箭头:表示流程的走向和顺序,连接各个图形元素。

应用场景
软件开发:在编写代码之前,使用流程图可以清晰地规划算法的逻辑结构,帮助开发者理清思路,减少编程错误。
业务流程梳理:企业可以使用流程图来描述和优化业务流程,使员工更好地理解各自的工作职责和流程中的协作关系。
教育领域:教师可以用流程图来讲解复杂的知识点,如数学题的解题步骤、化学反应的过程等,帮助学生更直观地理解。

具体参考文档进行学习

参考文档:(http://flowchart.js.org/)

示例:

Created with Raphaël 2.3.0 开始 我的操作 确认? 结束 yes no

2.5 插入classDiagram类图

简介:ClassDiagram(类图)是 UML(Unified Modeling Language,统一建模语言)中的一种静态结构图,用于描述系统的类、接口、协作(在 UML 2.0 中称为模块)、枚举、约束等元素及其相互关系。类图是面向对象系统建模的核心工具之一,它能够清晰地展示系统的静态结构,包括类与类之间的关联、继承、实现等关系,为系统的分析、设计和实现提供了重要的参考。

具体参考文档进行学习

参考文档:(https://mermaid-js.github.io/mermaid/#/classDiagram)

示例:

Cool
Where am i?
«interface»
Class01
int chimp
int gorilla
size()
AveryLongClass
Class09
C2
C3
Class07
Object[] elementData
equals()
Class10
>>service>>
int id
size()

3. CSDN快捷键

在这里插入图片描述

4. 字体相关设置

4.1 字体样式改变

不同字体设置:

1. 默认字体
2. <font face="宋体">宋体</font>
3. <font face="黑体">黑体</font>
4. <font face="雅黑">雅黑</font>
5. <font face="楷体">楷体</font>
6. <font face="STCAIYUN">华文彩云</font>
7. <font face="Arial">Arial</font><font face="fantasy">fantasy</font>

最终效果:

在这里插入图片描述

4.2 字体大小改变

<font size=1 > 1</font>
<font size=2 > 2</font>
<font size=3 > 3</font>
<font size=4 > 4</font>
<font size=5 > 5</font>
<font size=6 > 6</font>
<font size=7 > 7</font>
<font size=8 > 8</font>
<font size=9 > 9</font>
<font size=10 > 10</font>
<font size=11 > 11</font>
<font size=12 > 12</font>

最终效果:
在这里插入图片描述

4.3 字体颜色改变

<font color=green > green </font>
<font color=gold  > gold</font>
<font color=yellow  > yellow</font>
<font color=lawngreen  > lawngreen</font>
<font color=chartreuse  > chartreuse</font>
<font color=orange  > orange</font>
<font color=pink  > pink</font>
<font color=purple  > purple</font>
<font color=mediumblue  > mediumblue</font>
<font color=darkorange  > darkorange</font>
<font color=brown  > brown</font>
<font color=bright brown  > bright brown</font>
<font color=bright magenta  > bright magenta</font>
<font color=teal  > teal</font>
<font color=darkgreen  > darkgreen</font>

最终效果:
在这里插入图片描述

4.4 字体背景色实现


> <table><tr><td bgcolor=颜色替换位置> 想要什么颜色就换什么颜色 </td></tr></table>

颜色常用单词: red green blue gold yellow lawngreen chartreuse orange pink
purple mediumblue darkorange brown bright brown bright magenta teal
darkgreen

在这里插入图片描述

感谢您的阅读支持!!!

后续会持续更新的!!!

文末投票支持一下!!!

结束

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

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

相关文章

AI模型的构建过程是怎样的(下)

你好,我是舒旻。 上节课,我们讲了一个模型构建的前 2 个环节,模型设计和特征工程。今天,我们继续来讲模型构建的其他 3 个环节,说说模型训练、模型验证和模型融合中,算法工程师的具体工作内容,以及 AI 产品经理需要掌握的重点。 模型训练 模型训练是通过不断训练、验证…

K邻近算法

K邻近算法 1 算法介绍 1.1 什么是K-NN K-NN&#xff08;K Near Neighbor&#xff09;&#xff1a;k个最近的邻居&#xff0c;即每个样本都可以用它最接近的k个邻居来代表。K-NN算法属于监督学习方式的分类算法&#xff0c;即计算某给点到每个点的距离作为相似度的反馈。简单…

晋升系列4:学习方法

每一个成功的人&#xff0c;都是从底层开始打怪&#xff0c;不断的总结经验&#xff0c;一步一步打上来的。在这个过程中需要坚持、总结方法论。 对一件事情长久坚持的人其实比较少&#xff0c;在坚持的人中&#xff0c;不断的总结优化的更少&#xff0c;所以最终达到高级别的…

LoRA,DoRA,RSLoRA,LoRA+ 是什么

LoRA,DoRA,RSLoRA,LoRA+ 是什么 一、LoRA(Low-Rank Adaptation,低秩适应) 核心原理:冻结预训练模型参数,仅在每层插入两个低秩矩阵(A∈R^{rd}, B∈R^{dr}),通过分解权重增量ΔW=BA近似全秩更新,参数量仅为全量微调的0.01%-1%。 举例:在GPT-2(774M参数)的注意力…

HTTP发送POST请求的两种方式

1、json String json HttpRequest.post(getUrl(method, "v1", url, userId, appKey)).header("Content-type", "application/json") // 设置请求头为 JSON 格式.body(JSONUtil.toJsonStr(params)) // 请求体为 JSON 字符串.execute().body(); …

TCP并发服务器

单循环服务器&#xff1a;服务器在同一时刻只能响应一个客户端的需求。 并发服务器&#xff1a;服务器在同一时刻可以响应多个客户端的需求。 构建TCP服务器的方法&#xff1a; IO多路复用的函数接口[select() poll() epoll()] 1.多进程实现TCP并发服务器 #include <s…

【大模型统一集成项目】如何封装多个大模型 API 调用

&#x1f31f; 在这系列文章中&#xff0c;我们将一起探索如何搭建一个支持大模型集成项目 NexLM 的开发过程&#xff0c;从 架构设计 到 代码实战&#xff0c;逐步搭建一个支持 多种大模型&#xff08;GPT-4、DeepSeek 等&#xff09; 的 一站式大模型集成与管理平台&#xff…

Linux基础开发工具—vim

目录 1、vim的概念 2、vim的常见模式 2.1 演示切换vim模式 3、vim命令模式常用操作 3.1 移动光标 3.2 删除文字 3.3 复制 3.4 替换 4、vim底行模式常用命令 4.1 查找字符 5、vim的配置文件 1、vim的概念 Vim全称是Vi IMproved&#xff0c;即说明它是Vi编辑器的增强…

数据结构与算法效率分析:时间复杂度与空间复杂度详解(C语言)

1. 算法效率 1.1 如何衡量一个算法的好坏&#xff1f; 在计算机程序设计中&#xff0c;衡量算法优劣的核心标准是效率。但效率不仅指运行速度&#xff0c;还需要综合以下因素&#xff1a; 时间因素&#xff1a;算法执行所需时间 空间因素&#xff1a;算法运行占用的内存空间…

使用arm嵌入式编译器+makefile编译管理keil项目

目录 # arm嵌入式编译器-知识 # arm嵌入式编译器-知识 --- arm嵌入式编译器&#xff08;百度云盘&#xff09;下载&#xff1a;arm嵌入式编译器 keil&#xff0c; 链接 提取码: 8a6c arm官方使用教程&#xff1a; Arm Compiler 6 User Guide linux 安装完了有个非常重要的一步…

SwiftUI学习笔记day1---Stanford lecture1

SwiftUI学习笔记day1—Stanford lecture1 课程链接&#xff1a;Lecture 1 | Stanford CS193p 2023课程大纲&#xff1a;代码仓库&#xff1a;github/iOS 文章目录 SwiftUI学习笔记day1---Stanford lecture11.在Xcode中创建一个swiftUI的工程2.简单认识Xcode这个IDE3.尝试理解示…

vanna+deepseekV3+streamlit本地化部署

文章目录 1、vanna介绍1.1、基本介绍1.2、工作原理1.3、优点 2、vannadeepseekV3mysqlstreamlit本地化部署2.1、创建conda环境&#xff0c;安装依赖2.2、Mysql数据准备2.3、新建pycharm项目2.4、封装deepseek大模型2.5、定义MyVanna2.6、构建streamlit的app2.7、app演示 1、van…

【LangChain接入阿里云百炼deepseek】

这是目录 前言阿里云百炼注册账号使用代码执行结果 前言 大模型爆火&#xff0c;现在很多教程在教怎么使用大模型来训练Agent智能体&#xff0c;但是大部分教程都是使用的OpenAI。 最近阿里云推出DeepSeek-R1满血版&#xff0c;新用户可享100万免费Token额度。 今天就教大家怎…

【优选算法】二分法(总结套路模板)

目录 1. 题目一 &#xff1a;二分查找 解题思路&#xff1a; 模板总结&#xff08;简单版&#xff0c;不适用所有情况&#xff09; 代码实现&#xff1a; 2. 题目二 解题思路&#xff1a; 模板总结&#xff08;几乎万能&#xff09; 代码实现&#xff1a; 3. 题目…

Qt开源控件库(qt-material-widgets)的编译及使用

项目简介 qt-material-widgets是一个基于 Qt 小部件的 Material Design 规范实现。 项目地址 项目地址&#xff1a;qt-material-widgets 本地构建环境 Win11 家庭中文版 VS2019 Qt5.15.2 (MSVC2019) 本地构建流程 克隆后的目录结构如图&#xff1a; 直接使用Qt Crea…

游戏引擎学习第147天

仓库:https://gitee.com/mrxiao_com/2d_game_3 上一集回顾 具体来说&#xff0c;我们通过隐式计算来解决问题&#xff0c;而不是像数字微分分析器那样逐步增加数据。我们已经涵盖了这个部分&#xff0c;并计划继续处理音量问题。不过&#xff0c;实际上我们现在不需要继续处理…

uni-app打包成H5使用相对路径

网上找了一圈&#xff0c;没用&#xff0c;各种试&#xff0c;终于给试出来了&#xff0c;主要是网络上的没有第二步&#xff0c;只有第一步&#xff0c;导致打包之后请求的路径没有带上域名 运行的基础路径设置为./ config.js文件里面的baseUrl路径改成空字符&#xff0c;千万…

知识社区:打破传统知识传播的壁垒

知识社区的诞生 当今&#xff0c;知识库的上传与下载已无法满足现代用户对知识获取的多样化需求。随着信息量的爆炸式增长和用户需求的日益复杂化&#xff0c;传统的、静态的知识库显得力不从心。用户渴望能够实时互动、即时反馈、多维度探索知识的平台。正是在这样的背景下&am…

洛谷 P5534 【XR-3】等差数列 python

这题不用向下取整//就会错&#xff0c;不太能理解为什么...感觉对结果好像没什么影响啊 a1, a2, n map(int,input().split()) d a2 - a1 an a1 d * (n-1) s (a1an)*n//2 print(s)

机器人路径规划、轨迹优化系列课程

机器人路径规划、轨迹优化课程-第一讲-轨迹规划导论_哔哩哔哩_bilibili 机器人路径规划、轨迹优化课程-第二讲-Dijkstra算法原理讲解_哔哩哔哩_bilibili 机器人路径规划、轨迹优化课程-第四讲-A*算法原理和代码讲解_哔哩哔哩_bilibili 机器人路径规划、轨迹优化课程-第五讲-…