柚子快报邀请码778899分享:其他 MD文本编辑器使用
快捷方式
1、标题
1.1、Markdown格式文本
## 标题2 ##
### 标题3 ###
#### 标题4 ####
##### 标题5 #####
###### 标题6 #######
OR
Ctrl+1
Ctrl+2
Ctrl+3
Ctrl+4
Ctrl+5
Ctrl+6
1.2、显示效果
2、列表
2.1、 无序列表
2.1.1、Markdown格式文本
+ a
+ b
+ c
- d
- e
- f
* g
* h
* i
2.1.2、显示效果
abc
def
ghi
2.2 、嵌套列表
2.2.1、Markdown格式文本
无序
+ a
+ a1
+ a2
+ ba
+ c
有序
1. a
1. adac
1. adaw
2. adfsda
2. ad
3. sad
2.2.2、显示效果
无序
a
a1a2 bac
有序
a
adac
adaw adfsda adsad
3、引用快
3.1、行引用
3.1.1、Markdown格式文本
行引用
> adsadfafadfae aef ae
a ef a fae q3ef
3.1.2、显示效果
引用
adsadfafadfae aef ae a ef a fae q3ef
3.2、嵌套引用
3.2.1、Markdown格式文本
嵌套引用
> awd aw
>> a
3.2.2、显示效果
嵌套引用
awd aw
a
4、代码块
4.1、Markdown格式文本
代码块
`
adaawf
`
多行代码块儿
```
adaawfwrfwr
```
多行代码块设置语言
```sql
SELECT current_date;
```
4.2、显示效果
代码块 adaawf 多行代码块儿
adaawfwrfwr
多行代码块设置语言
SELECT current_date;
5、链接
5.1、Markdown格式文本
//链接
[百度1](www.baidu.com)
5.2、显示效果
//链接 百度1
6、图片
6.1、Markdown格式文本
![图片](https://note.youdao.com/favicon.ico)
6.2、显示效果
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-HQnCSW8u-1675302333647)(null#pic_left)]
6.3 粘贴图片设置
3.1 设置文件夹
3.2 打开偏好设置
3.3 设置图像
保存后文件自动保存到picture文件夹中
7、分割线
7.1、Markdown格式文本
分割线
---
- - -
-------
*****
* * *
____
7.2、显示效果
分割线
8、表格
8.1、Markdown格式文本
表格
|123|234|345|
|:-|:-:|-:|
|abc|bcd|cde|
|abc|bcd|cde|
|abc|bcd|cde|
|abc|bcd|cde|
|abc|bcd|cde|
//例子二
|123|234|345|
|:---|:---:|---:|
|abc|bcd|cde|
|abc|bcd|cde|
|abc|bcd|cde|
//例子三
123|234|345
:-|:-:|-:
abc|bcd|cde
abc|bcd|cde
abc|bcd|cde
8.2、显示效果
表格
123234345abcbcdcdeabcbcdcdeabcbcdcdeabcbcdcdeabcbcdcde
//例子二
123234345abcbcdcdeabcbcdcdeabcbcdcde
//例子三
123234345abcbcdcdeabcbcdcdeabcbcdcde
9、复选框
9.1、Markdown格式文本
- [ ] 复选框
- [x] 选中状态
9.2、显示效果
复选框 选中状态
10、换行
本行后边加两个空格
11、其他
11.1、Markdown格式文本
//斜体
*md*
//粗体
**md**
//斜体
_md_
//斜体
__md__
//转义
\+
//删除线
~~删除~~
11.2、显示效果
//斜体 md
//粗体 md
//斜体 md
//斜体 md
//转义
+
//删除线
删除
文本样式
Markdown是一种轻量级标记语言,排版语法简洁,让人们更多地关注内容本身而非排版。它使用易读易写的纯文本格式编写文档,可与HTML混编,可导出 HTML、PDF 以及本身的 .md 格式的文件。因简洁、高效、易读、易写,Markdown被大量使用,如Github、Wikipedia、简书等。
Markdown语法过于简洁,因此没有更改文本字体、字体大小、字体颜色的语法。但支持与HTML混编,使用HTML语法来改变字体、字体大小、字体颜色等。下面详细讲解一些。
1、Markdown现有的文本样式。
由表中可以看到 Markdown 仅支持 斜体、加粗、标记、删除、粉色五类文本样式,下面介绍HTML的 font 标签,使编写的Markdown格式文本支持修改字体、改字体大小、改字体颜色。
2、HTML的font标签-改字体、字体颜色、字体大小。
讲这个标签前,先看下面的 Markdown 格式文本及显示效果
2.1、Markdown格式文本
这是宋体
这是楷体
This is courier New
这是红色宋体
这是蓝色楷体
This is LightSeaGreen courier New
这是默认字体
这是红色4号宋体
这是蓝色5号楷体
This is LightSeaGreen courier New size 6
2.2、显示效果
这是宋体 这是楷体 This is courier New
这是红色宋体 这是蓝色楷体 This is LightSeaGreen courier New
这是默认字体 这是红色4号宋体 这是蓝色5号楷体 This is LightSeaGreen courier New size 6
2.3、font标签解释
从2.1、Markdown格式文本可以看到font标签的基本应用及格式,font标签主要有三个属性face、color、size分别用来设置文本的字体、颜色、大小。这三个属性可以单个地使用,如果对使用不清楚的,可以把2.1、Markdown格式文本内容复制到markdown编辑器,然后自己修改着看看。
注意: 选择的字体,要markdown编辑器支持的,如果太罕见的字体可能会没有而显示默认的字体 字体颜色可以是英文表示的,也可以是#后面加rgb值表示,颜色和rgb值的可以参考颜色码对照表 字体大小只有1到7总共7个字号可以选择
3、HTML的mark标签-标记文本
markdown本身也有标记文本的语法,这里再提供一种内嵌html的写法,供读者对比使用。
3.1、Markdown格式文本
这是正常文本
==这是 markdown 的标记文本==
这是 HTML 的标记文本
3.2、显示效果
这是正常文本 这是 markdown 的标记文本 这是 HTML 的标记文本
4、HTML的strong标签-加粗文本
markdown本身也有加粗文本的语法,这里再提供一种内嵌html的写法,供读者对比使用。
4.1、Markdown格式文本
这是正常文本
**这是 markdown 的加粗文本**
这是 内嵌HTML 的加粗文本
4.2、显示效果
这是正常文本 这是 markdown 的加粗文本 这是 内嵌HTML 的加粗文本
5、HTML的em标签-斜体文本
markdown本身也有斜体文本的语法,这里再提供一种内嵌html的写法,供读者对比使用。
5.1、Markdown格式文本
这是正常文本
**这是 markdown 的斜体文本**
这是 内嵌HTML 的斜体文本
5.2、显示效果
这是正常文本 这是 markdown 的斜体文本 这是 内嵌HTML 的斜体文本
6、HTML的del标签-删除文本
markdown本身也有删除文本的语法,这里再提供一种内嵌html的写法,供读者对比使用。
6.1、Markdown格式文本
这是正常文本
~~这是 markdown 的删除文本~~
这是 内嵌HTML 的删除文本
6.2、显示效果
这是正常文本 这是 markdown 的删除文本 这是 内嵌HTML 的删除文本
7、HTML的big、small标签-加大、减小字号
前面 2.HTML的font标签 介绍了怎样改字体大小,这里再介绍另一种写法,供读者对比使用。使用big标签字号比默认的大一号,使用small标签使字号比默认小一号
7.1、Markdown格式文本
这是比默认字号小一号的文本
这是默认字号文本
这是比默认字号大一号的文本
7.2、显示效果
这是比默认字号小一号的文本 这是默认字号文本 这是比默认字号大一号的文本
8、HTML的font、mark、strong、em、del、big、small混合使用
上面介绍的几个标签还可以混合使用,主要使用方式是在font标签前面加上其他标签,可以结合下面文本自己练习看看。
8.1、Markdown格式文本
这是默认字体
这是道奇蓝色courier New字体
这是高亮的道奇蓝色courier New字体
这是高亮加粗的道奇蓝色courier New字体
这是高亮加粗大一号的道奇蓝色courier New字体
这是高亮加粗大一号斜体的道奇蓝色courier New字体
8.2、显示效果
这是默认字体 这是道奇蓝色courier New字体 这是高亮的道奇蓝色courier New字体 这是高亮加粗的道奇蓝色courier New字体 这是高亮加粗大一号的道奇蓝色courier New字体 这是高亮加粗大一号斜体的道奇蓝色courier New字体
实现页内跳转
Markdown 的基础语法中并没有页内跳转的相关知识点,而Markdown可以与HTML混编,所以可以使用 HTML 的语法来实现页内跳转。总共就两个步骤:①在要跳达的地方创建锚点;②在文章中引用锚点。
一、创建锚点
锚点:是在文章中的某个位置做标记。如果将一篇文章比作一条有多户人家的巷子,创建锚点就好比是给其中一户人家安装门牌号。
在HTML中,可以用id来定义位置,所以创建锚点就是创建一个id,语法如下:
这里是创建了一个id="article_top" 的标签。
二、引用锚点
创建完锚点后,就相当于在文章的某个位置做了个标记,有了这个标记就可以使用 markdown 的语法(创建链接)引用这个位置,从而实现页内跳转。引用锚点本质上就是创建一个指向锚点的链接。语法如下:
[链接名称](#锚点id)
链接名称:是自己想定义的任何名称或描述,一般根据文章上下文确定。 锚点id:就是已经定义的锚点id。
注意: 锚点id前面还有一个#号。 锚点可以定义在文章的任意一行,引用锚点的链接也可以定义在文章任意位置。
三、实例讲解
下面给出了一份 Markdown 格式的文章,可以直接复制到Markdown编辑器去看看显示效果。 同时在3.2 显示效果也给出了 3.1 的文章对应的显示效果。
3.1 Markdown 格式文章
标题:Markdown 怎么实现页内跳转的
内容:
一、创建锚点
二、引用锚点
总结:
一、xxx
二、xxx
三、xxx
[回到顶部](#article_top)
如果不太懂,可以直接看[实例讲解](#example),把 Markdown 格式文章结合显示效果研究一下。
3.2 显示效果
文章顶部
文章顶部
标题:Markdown 怎么实现页内跳转的
内容:
一、创建锚点
二、引用锚点
三、实例讲解
总结:
一、xxx
二、xxx
三、xxx
回到顶部
如果不太懂,可以直接看实例讲解,把 Markdown 格式文章结合显示效果研究一下。
3.3 讲解
3.1 Markdown 格式文章中定义了2个锚点:锚点1(id=“article_top”)定义在文章顶部的前面;锚点2(id=“example”)定义在实例讲解的前面。同时文章也设置了两个引用锚点的链接:第一个链接是倒数第二行的回到顶部,引用了文章顶部的锚点;第二个链接是倒数最后一行的实例讲解,引用了实例讲解的锚点。在阅读文章时点击这2个链接时,会跳转到对应的锚点位置。
插入图片对齐方式
一、MD编辑器插入图片的方式:
不同的markdown编辑器可能有不同的显示效果,下面介绍的是CSDN的MD编辑器。 它插入图片语法:![图片描述](图片链接)
1.1 图片对齐方式
MD编辑器直接点图片按钮插入图片的方式就是居中对齐的,按图片的实际尺寸显示,这是默认的图片插入方式。它会在图片链接后面加上#pic_center的字样,由此可以推断:左对齐对应#pic_left,右对齐对应#pic_right,下面直接看例子。
1.1.1 markdown格式文本
- 下图是居中显示-图片默认插入方式
![图片描述](https://img-blog.csdnimg.cn/98ceaf6910c441d6b18ac3565cbb82b8.png#pic_center)
- 下图是左对齐显示
![图片描述](https://img-blog.csdnimg.cn/98ceaf6910c441d6b18ac3565cbb82b8.png#pic_left)
- 下图是右对齐显示
![图片描述](https://img-blog.csdnimg.cn/98ceaf6910c441d6b18ac3565cbb82b8.png#pic_right)
1.2 指定图片尺寸
MD编辑器提供了带尺寸的图片的插入方式,就是在图片链接的最后加上空格、等号宽x高,例如添加30x30尺寸就是=30x30,注意等号前面有个空格。下面用markdown文本举个例子。上面那个图片原图是360x360的,下面把它按照180x180地尺寸添加进来看看效果。至于左对齐、右对齐的尺寸,自己结合着使用就行了。
1.2.1 markdown格式文本
![图片描述](https://img-blog.csdnimg.cn/98ceaf6910c441d6b18ac3565cbb82b8.png#pic_center =180x180)
二、内嵌HTML语法实现插入图片
HTML插入图片的基础语法: 使用HTML语法插入图片,默认是左对齐的,可以用
在 HTML 中,
标签用来定义图片,是空标签,意思是说,它只包含属性,并且没有闭合标签。
src指 “source”。源属性的值是图像的 URL 地址
alt属性用来为图像定义一串可替换的文本。无法载入图像时,替换文本告诉读者,他们失去的信息。
title属性描述了元素的额外信息 (作为工具条使用)
height(高度) 与 width(宽度) 属性用于设置图像的高度与宽度。
style属性规定元素的行内样式(inline style),定义图片时可以用来缩放
align属性用来对齐,它的值有left、right、center、justify
2.1 markdown格式文本
- ``标签添加图片
- `alt`属性 - 这里图片链接错误,图片无法载入,所以显示了`alt`属性的文本
- `height、width`属性 - 指定宽高为150
- `
摩托车图片
柚子快报邀请码778899分享:其他 MD文本编辑器使用
相关阅读
本文由 用户 于 2024-05-01 发布在 金钥匙,如有疑问,请联系我们。
本文链接:https://www.51969.com/post/18824842.html
发表评论