编辑CSDN博客的一些功能和技巧

前言： 编辑CSDN博客时，发现使用背景色后，如果内容过少，内容就会居中，而不是左对齐，上网查找，一直没有 找到解决方法，最后自己摸索，成功解决，因此记录和分享一下，顺便分享一下我编辑CSDN博客时一些常用 的功能和技巧，希望有所帮助。 我使用的是markdown编辑器

一、目录

编辑CSDN博客时，如果想要生成目录，需要在前面加上 @[TOC]（这里写目录标题）

下面是效果图：

效果图是上面那个 一、目录的。

1.1 多级目录

可以用 #+空格来分级目录，# 是一级目录，## 是二级目录，以此类推，经过我的认证，分级目录最多只有六级 （不信的可以自己试一下)

1.2验证多级目录

我在前面写了三个### 号就是三级目录，效果图如下：

如果不想生成目录，就不要\@[TOC]（这里写目录标题），直接#+空格生成标题 。

二、文本样式

2.1 加粗

在文字两边加两个*就行，如下所示：
你好

2.2 斜体

在文字两边加一个*就行，如下所示：
今岁他年

2.3 删除线

在文字两边加两个~就行，如下所示：
诸邪

2.4 强调

在文字两边加两个`（这个符号是英文模式时ESC下面那个键盘）就行，如下所示：

流离

2.5 引用文本

这里是引用的文本

对应的效果图如下所示：

2.6空格、换行

 （注：记得加英文;）
空格实例
 空格实例

 、<br>（注：第一个指令好像只换了一个空格，不是我想要的，我一般用第二个）
换行实例 换行

换行

2.7 文字黄色高亮

<mark>黄色高亮<mark>
标签

对应样式效果图：

2.8背景色

下面是背景色的指令：

<table><tr><td bgcolor=Gold>背景色是金色</td></tr></table>

背景色是金色

加了背景色后就遇到了开头说的如果文字太少，文字就会在中间，如果需要左对齐，我们只需要加一个指令

<table><tr><td align="left" bgcolor=Gold>背景色是金色且文字左对齐</td></tr></table>

背景色是金色且文字左对齐

右对齐也一样

<table><tr><td align="right" bgcolor=Gold>背景色是金色且文字右对齐</td></tr></table>

背景色是金色且文字右对齐

居中：

<table><tr><td align="right" bgcolor=Gold>背景色是金色且文字右对齐</td></tr></table>

背景色是金色且文字居中

2.9 字体颜色

上面是背景色的，下面是字体 的

<font face="微软雅黑" color =red size=3>这是微软雅黑红色字体</font>    

这是微软雅黑红色字体

face：字体格式

color：字体颜色

size：字体大小（1~7，跟编辑时一样大的是3）

字体颜色还有另外一种表达

<font face="华文彩云" color="#00dddd">这是浅青色华文彩云字</font><br />

这是浅青色华文彩云字

一些我喜欢的背景色加文字颜色搭配：

<table><tr><td align="left" bgcolor=FloralWhite>世间唯一不变是人都善变</td></tr></table>

世间唯一不变是人都善变

<table><tr><td align="left" bgcolor=black><font color =white size=3>请尽情拥抱不可预知的命运吧</font> </td></tr></table>

请尽情拥抱不可预知的命运吧

如果想改变某些文字的颜色，那就再在文字里面加入更改字体颜色的指令

例如：

<table><tr><td align="left" bgcolor=black><font color =white size=3>请尽情拥抱<font color =Cyan size=3>不可预知</font> 的命运吧</font> </td></tr></table>

请尽情拥抱不可预知 的命运吧

一些博主的颜色库和字体格式链接

颜色库
字体和颜色

三、插入代码

可以通过顶部工具栏的代码块插入对应的代码

3.1更改代码块底色

点击创作中心，往下滑找到博客设置，接着往下滑找到代码片样式，那里可以选择自己喜欢的代码块底色。



代码片样式：

四、插入表格

可以点击顶部工具栏的表格按钮插入表格，也可以通过以下指令插入

人物     | 特点
-------- | -----
小高  | 高
小叶  | 富
小林  | 帅

人物	特点
小高	高
小叶	富
小林	帅

表格内容居中，居左，居右（默认居中）

使用`:---------:`居中
使用`:----------`居左
使用`----------:`居右
| 居中       | 居左        | 居右        |
|:-----------:| :-------------|-------------:|
| 这是文本居中 |  这是文本居走  | 这是文本居右 |

居中	居左	居右
这是文本居中	这是文本居左	这是文本居右

五、插入图片

通过点击顶部工具栏的图片按钮插入图片

5.1更改图片大小

当我们插入的图片太大或者太小时，我们可以通过 = 100x100改变大小（注，=前面记得留空格，那个x是小写x）

这是下面原图的大小

![图片](https://i-blog.csdnimg.cn/direct/2bdb978442494b0290a799b2fabf9cac.jpeg#pic_center)

这是改变大小后的

![图片](https://i-blog.csdnimg.cn/direct/d193a15abd9247d181a4ad78498d53d5.jpeg#pic_center =500x500)

#pic_center 居中
#pic_left 居左
#pic_right 居右

下面是居左的演示，居右类似

![在这里插入图片描述](https://i-blog.csdnimg.cn/direct/f0cb94ba644d4d7c94b3e62e3d77f34b.jpeg#pic_left =500x500)

七、插入超链接

点击顶部工具栏超链接按钮插入

然后复制粘贴超链接地址就行

总结： 以上就是我编辑博客时用到的一些功能和技巧了，希望对大家有所帮助。 如果觉得有所帮助，可以点一下赞，谢谢大家。 有什么疑惑可以评论区留言或者私信，当然浏览过程中发现错误，欢迎大家指正。 后续有其他功能和技巧我也会增加进在这篇博客中 然后再说一下在编辑博客的过程中，如果同样的指令但是出现的效果不同，记得在前面留个空行，回车一下。 路虽远，行则将至；事虽难，做则必成，愿大家越来越好！

以下是一些相关的文章：
相关文章
相关文章