CSDN-Markdown 扩展功能基于 HTML 的实现

最新推荐文章于 2023-11-25 23:03:14 发布

ThitherShore

最新推荐文章于 2023-11-25 23:03:14 发布

阅读量1k

点赞数

分类专栏： markdown 文章标签： Markdown

本文链接：https://blog.csdn.net/thither_shore/article/details/52203138

版权

markdown 专栏收录该内容

8 篇文章 8 订阅

订阅专栏

Markdown 是一种可以使用普通文本编辑器编写的标记语言，可使文本具有一定格式。CSDN-markdown 编辑器是其衍生版本，支持基于 PageDown ( Stack Overflow 所使用的编辑器) 的扩展功能（如表格、脚注、内嵌HTML、内嵌 LaTeX 等等）。本文讨论 CSDN-markdown 借助内嵌 HTML 等对于一些扩展功能的实现方法，作为个人笔记，同时供分享。文末推荐详尽入门基础教程。

插图的大小和位置

插图入门图文详细教程见[CSDN-markdown编辑器插入网上或本地电脑上的图片]。通常我们不能自主地调控图片大小，位置，名称，这使得排版不够美观，推荐博文CSDN-markdown语法之如何插入图片，介绍了这些功能借助内嵌 HTML 的实现方式，探讨了

问题1：图片上传和图片链接两种方式的区别
问题2：Markdown中如何指定图片的高和宽？

 <img src="http://imgtech.gmw.cn/attachement/jpg/site2/20111223/f04da22d7ba7105e1d7507.jpg" width = "300" height = "120" alt="CSDN图标" />

问题3：Markdown中如何指定图片的对齐方式？

方法一：

 <center>
![CSDN图标](http://imgtech.gmw.cn/attachement/jpg/site2/20111223/f04da22d7ba7105e1d7507.jpg "这是CSDN的图标")
</center>

方法二：

 <div align="center">
<img src="http://imgtech.gmw.cn/attachement/jpg/site2/20111223/f04da22d7ba7105e1d7507.jpg"  alt="CSDN图标" />
 </div>

　　其中 align 可选 left，right 或者 center。

页间跳转（锚点链接）

　　什么是锚点链接？例如，一个很长的页面，在页面的最下方有一个“返回页首”的文字，单击链接后，可以跳转到这个页面最顶端，这就是一种最典型的锚点链接，即页内跳转。另外 CSDN 支持页间跳转，即锚点链接可指向非本页面中的位置。
　　本文将举例讲解页内跳转的实现，页间跳转推荐点击这里学习。

实现方法

Step 1：定义位置标记

首先，要定义想让锚点去指定的位置标记（即这行代码：<div id="footer"></div>)，其中“footer”只是自己设定的该位置名称，可以随意修改。

Step 2：设置锚点链接

其次，将定义好的位置标记放到要跳转到的地方。然后把锚点链接（即#footer）用像插入网页链接一样方式放在任意地方，当点击这个锚点链接（跳转链接）时就会跳到位置标记所在的位置1。

实现案例

<div id="Mark"></div>这句话定义了锚点所指定的位置标记，名字为“Mark”.
[这句话是想要跳转到Mark处的锚点链接，点击即会跳转](#Mark).

实现效果

这句话定义了锚点所指定的位置标记，名字为“Mark”.
这句话是想要跳转到Mark处的锚点链接，点击即会跳转.

跨行表格

实现方法

<table><tbody>
    <tr>
        <th rowspan="3">我占了三行</th>
        <th>第一列</th>
        <th>第二列</th>
        <th>第三列</th>
    </tr>
    <tr>
        <td>第一列</td>
        <td>第二列</td>
        <td>第三列</td>
    </tr>
    <tr>
        <td>第一列</td>
        <td>第二列</td>
        <td>第三列</td>
    </tr>
</table>

实现效果

我占了三行	第一列	第二列	第三列
	第一列	第二列	第三列
	第一列	第二列	第三列

导入导出和个性模板

值得一提的是 CSDN-Markdown 导入导出功能应该得到更充分的利用，它的价值总是被大家忽略。以下两段引用文字均来源于CSDN Markdown简明教程5-快速上手.

使用导入导出

CSDN Markdown内置了导入导出功能，这个功能非常有用，如下所示。

实现不同平台间共享文件，例如不少博友同步更新自己的独立博客，本段引用作者的独立博客。
收集整理文章形成电子书，gitbook就是一个不错的方案。
博文与PPT之间的相互转换，可参考这里。

个性定制文章模板

在博文写作过程中，每种类型的文章都有一些通用的格式，例如版权声明标识、例如原创翻译文章的“译者说”等。如果可以个性定制文章模板，需要的时候调用将能极大地提高工作效率。我们可以利用CSDN Markdown 编辑器创建文章模板，然后利用“导出到本地”功能将模板存到本地（或网络地址），需要该模板时使用“从本机导入”（或“从线上导入”）即可。

附：强推一系列 CSDN-Markdown 基本语法教程，透彻详尽地解读了那篇“欢迎使用 CSDN-Markdown编辑器”，并做以充分拓展，非常适合入门及学习：
　　CSDN Markdown简明教程1-关于Markdown
　　CSDN Markdown简明教程2-基本使用
　　 CSDN Markdown简明教程3-表格和公式
　　 CSDN Markdown简明教程4-UML图
　　 CSDN Markdown简明教程5-快速上手

　　另外也可参考CSDN Markdown基本语法说明.

　　简书上Markdown入门学习小结，这里讨论的是基本的markdown语法，而不是CSDN-markdown.
　　