我的CSDN博客

一、前言

这是一篇关于 写 CSDN博客的文章，包括部分Markdown语法。记录我的博客规范，技巧，模板，心得。

二、写博客的规范

1. 一个标题就够了，没必要在正文里面添加一个居中标题，画蛇添足。
2. 少用图片，图片加载比较慢，超过10张图片的安装教程直接用网盘链接，不要直接上传到博客。
3. 正文里面最好不用缩进，浪费时间，而且不缩进也没那么难看。
4. 多空行，避免文章过于拥挤。
5. 文章随机出现防伪标识，例如昵称，CSDN的ID，甚至博客链接。

三、Markdown语法

1、如何生成目录？

在需要添加目录的地方写 @[toc] 即可。

@[toc]

> @[toc]

2、如何实现页面内跳转？

比如：查看目录_{（备注：此锚点只在网页端有效）}

示例：点击此处跳转到文章末尾

[点击此处](#end)

<a id="end"></a>

备注：中括号里面可以随便写，圆括号里面#后面的内容必须和id=""的双引号里面的内容一致。

3、外部链接怎么在新标签页打开？

注：Markdown编辑器的链接一般是在新标签页打开，如果不能打开，就用此办法。

答：在需要插入链接的地方添加如下语句。

<a href="url" target="_blank">name</a>

url改成网页的网址，name可替换成任何文字。

举例：去我的博客首页。语句如下：

<a href="https://blog.csdn.net/pfdvnah" target="_blank">wowpH</a>

体验一下：wowpH

4、如何插入图片？

01. 普通方法

![alt](url)

示例：

![wowpH的头像](https://i-blog.csdnimg.cn/blog_migrate/d84f60d6b543c4aefe5f039538319f69.jpeg)

效果如下：下面是我的正常加载 ¹ 的头像。

如果链接写错了，比如写成了这样（最后一个字母掉了）：

![wowpH的头像](https://imgconvert.csdnimg.cn/aHR0cHM6Ly9hdmF0YXIuY3Nkbi5uZXQvNC84L0MvM19wZmR2bmFoLmpwZ)

那么在原本应该显示图片的位置出现：

02. 图片居中

![alt](url#pic_center)

示例：

![wowpH的头像](https://i-blog.csdnimg.cn/blog_migrate/d84f60d6b543c4aefe5f039538319f69.jpeg#pic_center)

效果如下：

03. 改变图片大小

![alt](url#pic_center =widthxheight)

注：等号前面必须有一个空格，width 和 height 之间是字母 x 不是乘号。

示例：
原图：

![CSDN全球最大中文IT社区](https://i-blog.csdnimg.cn/blog_migrate/429c8d59bc28339f28a8e4a62489bae3.jpeg =418x150)

通过上面代码缩小后，效果如下：

04. 图片文字提示

![alt](url "tips")

示例：

![wowpH的头像](https://i-blog.csdnimg.cn/blog_migrate/d84f60d6b543c4aefe5f039538319f69.jpeg "wowpH的头像")

将鼠标移到图片上不动就能看到提示，效果如下：

四、版权声明模板

将Title替换成文章标题。将Link替换成文章链接。

---
版权声明
1. 转载、参考、引用必须在首页添加如下文字：
`[Title—wowpH](Link)`
2. 代码原创，公开引用不能删除首行注释（作者，版本号，时间等信息）；
3. 如果有疑问欢迎评论区留言，尽量解答；
4. 如果有错误，还望大侠评论区指正。
---

五、博客表格模板

<table align="center">
	<tr>
		<th>博主</th>
		<th colspan="2">简介</th>
		<th colspan="2">博客</th>
	</tr>
	<tr >
		<td rowspan="5">
		<a href="https://blog.csdn.net/pfdvnah" title="wowpH">
		<img src="https://i-blog.csdnimg.cn/blog_migrate/d84f60d6b543c4aefe5f039538319f69.jpeg" /><br>
		<font size="4">wowpH</font>
		</a>
		</td>
		<td>排名：</td>
		<td>29758</td>
		<td rowspan="4" colspan="2">
		<a href="https://blog.csdn.net/pfdvnah" title="wowpH">
		<font size="7">wowpH</font>
		</a>
		<br/><br/>
		Not Simple Java - LeetCode - PTA - OJ - Algorithm - Qun:793467972
		</td>
	</tr>
	<tr>
		<td>粉丝：</td>
		<td>60</td>
	</tr>
	<tr>
		<td>原创：</td>
		<td>195</td>
	</tr>
	<tr>
		<td>积分：</td>
		<td>2406</td>
	</tr>
	<tr>
		<td>等级：</td>
		<td>5</td>
		<td rowspan="2">简介：</td>
		<td rowspan="2">不简单的Java。 LeetCode，PTA，OJ，ACM，POJ，WUSTOJ，算法，数据结构。Qun:七九三四六七九七二</td>
	</tr>
</table>

效果如下：

博主	简介		博客
wowpH	排名：	29758	wowpH Not Simple Java - LeetCode - PTA - OJ - Algorithm - Qun:793467972
	粉丝：	60
	原创：	195
	积分：	2406
	等级：	5	简介：	不简单的Java。 LeetCode，PTA，OJ，ACM，POJ，WUSTOJ，算法，数据结构。Qun:七九三四六七九七二

六、设置博客字体和颜色

代码如下：

<font color="颜色名" face="字体名" size="大小">需要改变的文字</font>

?颜色名，十六进制颜色值，颜色对照表

示例如下：

样式	代码
红色黑体2号	<font color="Red" face="黑体" size="2">红色黑体2号</font>或 <font color="#FF0000" face="黑体" size="2">红色黑体2号</font>
绿色宋体3号	<font color="Green" face="宋体" size="3">绿色宋体3号</font>或 <font color="#00FF00" face="宋体" size="3">绿色宋体3号</font>
蓝色楷体4号	<font color="Blue" face="楷体" size="4">蓝色楷体4号</font>或 <font color="#0000FF" face="楷体" size="4">蓝色楷体4号</font>
红色华文行楷2号	<font color="Red" face="华文行楷" size="2">红色华文行楷2号</font>或 <font color="#FF0000" face="华文行楷" size="2">红色华文行楷2号</font>

七、LaTeX 数学公式

在公式两端加上美元（$）符号即可，如下所示：

$数学公式$

加双层美元符号，公式就会另起一行居中。

八、结束语模板

<center><font face="Consolas" size="2">- End - wowpH - pfdvnah -</font></center>

九、常用Markdown表情

1、人物

Syntax	Preview
:smirk:	?
:+1:	?
:point_down:	?
:muscle:	?

2、其他

Syntax	Preview
:link:	?
:page_facing_up:	?
:speech_balloon:	?
:computer:	?
:exclamation:	❗️
:open_file_folder:	?

---

版权声明：

1. 转载请于首页注明链接形式的写CSDN博客——wowpH；
2. 代码原创，公开引用不能删除首行注释（作者，版本号，时间等信息）；
3. 如果有疑问欢迎评论留言，尽量解答。

---

返回顶部

返回到 如何实现页面内跳转

- End - wowpH - pfdvnah -

---

1. 示例中的图片是我的头像，如果我换头像了，可能就不能正常显示，但是语句都是对的，照着来不会错。 ↩︎