【实战】手把手教你在 vscode 中写 markdown

这篇具有很好参考价值的文章主要介绍了【实战】手把手教你在 vscode 中写 markdown。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。


markdown 语法、markdown 插件咱先放放,先说最头疼的,图片问题

一、Paste Image

相对于 HBuilder 自带 markdown 图片粘贴功能来说,vscode显得不那么友好,若是不装插件粘贴截图就只能手动进行如下操作:

  • 截取图片
  • 将图片存在特定位置
  • 在markdown文件中通过路径引入图片
  • 预览

最终我找到了 Paste Image 拓展插件

markdown在vscode怎么使用,vscode,github,ide

截图后,使用 Ctrl+Alt+V 就可以把图片粘贴到Markdown文档里了

默认文件会保存到与 md 文件同级目录下,并以相对路径方式引用。
我按自己习惯将图片保存地址修改为./images
markdown在vscode怎么使用,vscode,github,ide


over


二、其他 markdown 插件

主要内容完毕,下面是一些其他 markdown 相关 vscode 插件:

1.Markdown All in One

  • vscode 官方对 Markdown 语言 的一些基础支持说明:
    Markdown editing with Visual Studio Code
  • Markdown All in One - Visual Studio Marketplace
    markdown在vscode怎么使用,vscode,github,ide
    包含了最常用的 Markdown 优化:键盘快捷键,目录,自动预览等
Key Command
Ctrl/Cmd + B Toggle bold
Ctrl/Cmd + I Toggle italic
Alt+S (on Windows) Toggle strikethrough
Ctrl + Shift + ] Toggle heading (uplevel)
Ctrl + Shift + [ Toggle heading (downlevel)
Ctrl/Cmd + M Toggle math environment
Alt + C Check/Uncheck task list item
Ctrl/Cmd + Shift + V Toggle preview
Ctrl/Cmd + K V Toggle preview to side

2.Markdown Preview Github Styling

  • Markdown Preview Github Styling

改变VS Code 的内置 markdown 预览,以匹配GitHub的样式。包括对浅色和深色GitHub主题的支持。默认情况下,主题类型(亮vs暗)是根据vs Code主题选择的。


有其他好用的插件欢迎评论留言交流

三、拓展学习 —— markdown语法基础

1.标题

常用写法(注意空格)

# 一级标题

# 二级标题

# 三级标题

# 四级标题
# 五级标题
# 六级标题

不常用写法

一级标题
==
二级标题
--

建议标题前后留空行,以增加可读性

2.字体样式

粗体

**粗体**粗体
__粗体__粗体

斜体

*斜体*斜体
_斜体_斜体
推荐使用*而非_

删除线

~~删除线~~ 删除线

3.段落

一般以空行分段,无空行默认表示同一段落,段内换行需要在行末添加两个或以上空格

4.列表

有序列表

  1. 有序列表1
    2. 有序列表2
    3. 有序列表3

无序列表

*±和列表内容搭配(中间空格隔开),层次使用tab表示,推荐使用-

  • * 无序列表1
    • * 无序列表2
      • * 无序列表3
  • + 无序列表1
    • + 无序列表2
      • + 无序列表3
  • - 无序列表1
    • - 无序列表2
      • - 无序列表3

分割线

—/___/***,三种方法,至少三个符号




5.图片

markdown在vscode怎么使用,vscode,github,ide

![图片描述文字](https://img.csdn.cn/.../img.png)

6.链接

直接链接

必须以协议开头,比如http、https、ftp
https://www.baidu.com:<https://www.baidu.com>

文本链接

英文状态下的中括号包含描述文本,紧接着小括号包含超链接地址:
百度:[百度](https://www.baidu.com)

引用链接

百度
。。。其他内容

[百度][baidu]
。。。其他内容
[baidu]: https://www.baidu.com

锚点

高级部分

[高级部分](#高级部分)
...
<h1 id="高级部分">二、高级部分</h1>

7.代码

行内代码

let function = num => num + 1

`let function = num => num + 1`

代码块

代码前加tab或四个空格,且前后空行

let function = num => num + 1


```javascript
let function = num => num + 1
```

8.引用

引用内容,依旧可以使用其他markdown语法,加粗样式code
使用 Ctrl+Alt+Del 重启电脑

表头 表头 表头
单元格 单元格 单元格
左对齐 居中 右对齐

可以嵌套使用

> 引用内容,依旧可以使用其他markdown语法,**加粗样式**`code`
> 使用 <kbd>Ctrl</kbd>+<kbd>Alt</kbd>+<kbd>Del</kbd> 重启电脑
> | 表头 | 表头 | 表头 |
> | :- | :-: | -: |
> | 单元格  | 单元格 | 单元格 |
> | 左对齐  | 居中 | 右对齐 |
> > 可以嵌套使用

9.表格

表头 表头 表头
单元格 单元格 单元格
左对齐 居中 右对齐
| 表头 | 表头 | 表头 |
| :- | :-: | -: |
| 单元格  | 单元格 | 单元格 |
| 左对齐  | 居中 | 右对齐 |

10.支持的 HTML 元素

使用 <kbd>Ctrl</kbd>+<kbd>Alt</kbd>+<kbd>Del</kbd> 重启电脑

使用 Ctrl+Alt+Del 重启电脑

<details>
  <summary> 点击此区域标题:查看详细内容 </summary>
  <p> - 测试文本段落 </p>
  <pre><code>  title,value,callBack可以缺省  </code>  </pre>
</details>

CSDN的编辑器并不支持可折叠文本
markdown在vscode怎么使用,vscode,github,ide
markdown在vscode怎么使用,vscode,github,ide

11.表情符号

😄、😆、😊、😃、😏、😍
☀️、☔️、☁️、❄️、⛄️、⚡️
🎍、💝、🎎、🎒、🎓、🎏
🏠、🏡、🏫、🏢、🏣、🏥
1️⃣、2️⃣、3️⃣、4️⃣、5️⃣、6️⃣

:smile:、:laughing:、:blush:、:smiley:、:smirk:、:heart_eyes:
:sunny:、:umbrella:、:cloud:、:snowflake:、:snowman:、:zap:
:bamboo:、:gift_heart:、:dolls:、:school_satchel:、:mortar_board:、:flags:
:house:、:house_with_garden:、:school:、:office:、:post_office:、:hospital:
:one:、:two:、:three:、:four:、:five:、:six:

🎁 Emoji cheat sheet for GitHub, Basecamp, Slack & more文章来源地址https://www.toymoban.com/news/detail-533872.html

12.任务列表

  • 待完成
  • 已完成
- [ ] 待完成
- [x] 已完成

到了这里,关于【实战】手把手教你在 vscode 中写 markdown的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 9个步骤,手把手教你在Windows上安装Hadoop

    在Windows上安装Hadoop时经常会出现许多错误,很多用户使用基于Linux的操作系统。本文详细讲述如何在Windows上安装和运行Apache Hadoop,如果遇到了问题,可以参考文章中的步骤进行解决。 微信搜索关注《Java学研大本营》 在 Microsoft Windows 上运行 Apache Hadoop 是比较繁琐的任务,在

    2024年02月08日
    浏览(70)
  • 手把手教你在Docker中安装Nginx(图文超详细)

    本文介绍如何在 Windows Docker Desktop 平台安装 Nginx 容器(Linux 平台同样适用),并详细讲解如何配置 Nginx ,实现 HTTP 请求在后端服务器集群间的负载均衡。 访问 dockerhub 查找所需的镜像版本: 这里我选择 1.24.0 版,执行如下命令: 命令执行结果: 随后,我们第一次运行镜像,

    2024年03月16日
    浏览(68)
  • 手把手教你在windows使用Docker搭建Minio[详细教程]

    目录 1什么是Minio 2安装Docker 3Docker搭建Minio 4.创建Minio容器并运行 5.进行访问 6安装可能出现的问题         MinIO是一个基于开源的对象存储服务器,MinIO的设计目标是提供高性能、高可用性和高可靠性的对象存储服务。MinIO可以作为一个独立的对象存储服务,也可以在Kuber

    2024年02月12日
    浏览(49)
  • 手把手教你在 Windows 环境中搭建 MQTT 服务器

    前些天要对接一家硬件商的设备数据,对方使用的 MQTT 协议点对点透传,所以又赶紧搭建 MQTT 服务器,写 .NET 程序接收数据等等,今天分享一下如何搭建 MQTT 服务器。 MQTT(Message Queuing Telemetry Transport)是一种轻量级的、基于发布/订阅模式的通信协议,专门设计用于在低带宽

    2024年02月03日
    浏览(60)
  • 新手教程科普,手把手教你在bitget walelt用Uniswap

    Uniswap 是以太坊区块链上领先的去中心化交易所 (DEX),允许用户交换和交易各种加密货币。 Uniswap 于 2018 年 11 月推出,是以太坊最早的 DApp 之一。目前有四个版本;其中V1、V2、V3都有开源代码库。 与 Coinbase 或 Binance 等传统中心化交易所 (CEX) 不同,Uniswap 不受任何单一实体控

    2024年03月20日
    浏览(49)
  • 手把手教你在linux中部署hadoop以及hadoop功能介绍

    我们在学大数据的时候hadoop是躲避不开的地方,所以如何在linux中部署hadoop,下面就是手把手教你如何部署hadoop。你只要复制粘体,然后按enter键就可以了。 准备:   安装Linux版本的服务器。可以参考中前半部分安装服务器的内容即可:VM部署CentOS并且设置网络_ZeroMaster的博客

    2024年02月03日
    浏览(55)
  • 手把手教你在linux环境下更换python的pip源

    搞python的肯定离不开各种各样的第三方包,比如爬虫,有requests,xpath,爬虫界的扛把子Scrapy;Web有django,flask,restframework啥的,还是挺多的,我们一般安装的方式都是pip install xx模块,但是我相信,你们肯定都遇到过这种情况。 如果我们从默认的 https://pypi.org/ 安装的过程非

    2024年02月12日
    浏览(47)
  • 【运维】手把手教你在windows使用Docker搭建Minio[详细教程]

    目录 1什么是Minio 2安装Docker 3Docker搭建Minio 4.创建Minio容器并运行 5.进行访问 6安装可能出现的问题         MinIO是一个基于开源的对象存储服务器,MinIO的设计目标是提供高性能、高可用性和高可靠性的对象存储服务。MinIO可以作为一个独立的对象存储服务,也可以在Kuber

    2024年02月06日
    浏览(56)
  • 手把手教你在云环境炼丹(部署Stable Diffusion WebUI)

    前几天写了一篇《 手把手教你在本机安装Stable Diffusion秋叶整合包 》的文章,有些同学反映对硬件的要求太高,显卡太TM贵了。今天我再分享一个云服务器炼丹的方法,方便大家快速入门上手,这个云服务不需要特殊网络设置,能连接公网网盘,随开随用,有3090显卡,也有

    2024年02月15日
    浏览(45)
  • 手把手教你在Centos7.6系统安装mysql5.7

    需要安装对应系统适配的mysql,避免出现问题 我的是CentOS Linux release 7.6.1810 (Core) ,所以安装centos7.6对应的mysql5.7 点击链接在官网中获取适用的mysql文件,这里我找到的是mysql57-community-release-el7.rpm,其中mysql57代表mysql5.7,el代表centos,7代表centos的版本(因为未发布el7.6,所以用

    2024年02月03日
    浏览(67)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包