Markdown基础(内含:锚点使用,使用HTML,新页面跳转,目录生成)

说下Markdown语法

逆天推荐使用VSCode编写 

装这个插件写作更方便: 

内含:锚点使用,使用HTML,新页面跳转,目录生成

启用方式:

H1H3(#的个数)[博客园只支持H13]

# H1
## H2
### H3

H1

H2

H3

斜体(一个*斜体),加粗(两个*粗体),删除线(两个~)

**加粗内容** 其他内容 *斜体内容* ~~删除内容~~

加粗内容 其他内容 斜体内容 删除内容

引用(> or >>)、代码块(```开头结尾)、分隔符(---)、换行(空一行 或者 br标签 )、转义( \ )

引用:

>引用 | 块注释
>从前有座山,山里有座庙
>>里面再来个引用

引用 | 块注释 从前有座山,山里有座庙 里面再来个引用

代码块: 以```(反引号)开头 以```(~下面的符合)结尾

如果要语法高亮就在```后面加小写语言名,eg:html,css,javascript,python,cs(csharp)等等

print("以 ```python开头,```结尾")
var infos_list = new List<object>() { "C#", "JavaScript" };
var infos_list = new List<object>() { "C#", "JavaScript" };

分隔符:

---

换行:

<br/>
<br/>
<br/>

转义字符

\<br/>

<br/>

HTML代码

直接写HTML就可以解析:

<div>
    <code>
        print("mmd")
    </code>
</div>

print("mmd")

超链接、图片、锚点跳转

超链接:

页面内打开:[超链接文字](url)
写法1:
汇总系列:[链接](https://www.cnblogs.com/dunitian/p/4822808.html#ai)

写法2:
汇总系列:<https://www.cnblogs.com/dunitian/p/4822808.html#ai>

汇总系列:https://www.cnblogs.com/dunitian/p/4822808.html#ai

汇总系列:https://www.cnblogs.com/dunitian/p/4822808.html#ai

新页面打开:[超链接文字](url){:target="_blank"} (有些编辑器不支持,Python Markdown可以使用)
不支持就用:<a href="xxx" target="_blank">xxx</a>

写法1:
汇总系列:[链接](https://www.cnblogs.com/dunitian/p/4822808.html#ai){:target="_blank"}

写法2:
汇总系列:<https://www.cnblogs.com/dunitian/p/4822808.html#ai>{:target="_blank"}

写法3:
汇总系列:<a href="https://www.cnblogs.com/dunitian/p/4822808.html#ai" target="_blank">链接</a>

汇总系列:https://www.cnblogs.com/dunitian/p/4822808.html#ai{:target="_blank"}

汇总系列:https://www.cnblogs.com/dunitian/p/4822808.html#ai{:target="_blank"}

汇总系列:https://www.cnblogs.com/dunitian/p/4822808.html#ai


图片:(感叹号别忘记了)

![alt标题](url地址)
![博客园logo](https://www.cnblogs.com/images/logo_small.gif)

锚点:(不能实现的就用html实现即可)

我在正文开头定义了一个:<a name="divtop"></a>
我们跳转过去:[跳转指定位置](#divtop)

跳转指定位置

列表(无序- 有序 1.2.3. 注意空格)

- 无序列表1
    - 无序列表1.1
    - 无序列表1.2
        - 1.2.1
- 无序列表2
    1. 有序列表1
    2. 有序列表2
    3. 有序列表3
        1. 3.1
        2. 3.2
            1. 3.2.1
            2. 3.2.2
- 无序列表3
  • 无序列表1
    • 1.2.1
    • 无序列表1.1
    • 无序列表1.2
  • 无序列表2
    • 3.2.1
    • 3.2.2
    1. 3.1
    2. 3.2
    3. 有序列表1
    4. 有序列表2
    5. 有序列表3
  • 无序列表3

目录生成就用js实现了,MarkDown的方式太累

博客园上传js文件,然后引用即可

$(function () {    // 生成目录索引列表
    var mainContent = $('#cnblogs_post_body');    var h2_list = $('#cnblogs_post_body h2');//如果你的章节标题不是h2,只需要将这里的h2换掉即可

    if (mainContent.length < 1)        return;    if (h2_list.length > 0) {        var content = '<a name="_labelTop"></a>';
        content += '<div id="navCategory">';
        content += '<p style="font-size:18px"><b>目录</b></p>';
        content += '<ul>';        for (var i = 0; i < h2_list.length; i++) {            var go_to_top = '<div style="text-align: right"><a href="#_labelTop">回到顶部</a><a name="_label' + i + '"></a></div>';            $(h2_list[i]).before(go_to_top);            var h3_list = $(h2_list[i]).nextAll("h3");            var li3_content = '';            for (var j = 0; j < h3_list.length; j++) {                var tmp = $(h3_list[j]).prevAll('h2').first();                if (!tmp.is(h2_list[i]))                    break;                var li3_anchor = '<a name="_label' + i + '_' + j + '"></a>';                $(h3_list[j]).before(li3_anchor);
                li3_content += '<li><a href="#_label' + i + '_' + j + '">' + $(h3_list[j]).text() + '</a></li>';
            }            var li2_content = '';            if (li3_content.length > 0)
                li2_content = '<li><a href="#_label' + i + '">' + $(h2_list[i]).text() + '</a><ul>' + li3_content + '</ul></li>';            else
                li2_content = '<li><a href="#_label' + i + '">' + $(h2_list[i]).text() + '</a></li>';
            content += li2_content;
        }
        content += '</ul>';
        content += '</div><p>&nbsp;</p>';
        content += '<p style="font-size:18px"><b>正文</b></p>';        if ($('#cnblogs_post_body').length != 0) {            $($('#cnblogs_post_body')[0]).prepend(content);
        }
    }    var allinfo = '<p><strong>汇总系列:<a href="https://www.cnblogs.com/dotnetcrazy/p/9160514.html" target="_blank">https://www.cnblogs.com/dotnetcrazy/p/9160514.html</a></strong></p>';    $(mainContent[0]).prepend(allinfo);
});

更多语法请参考

https://www.cnblogs.com/dotnetcrazy/p/9180295.html

原创声明,本文系作者授权云+社区发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

发表于

我来说两句

5 条评论
登录 后参与评论

相关文章

来自专栏Petrichor的专栏

Markdown 操作

  最开始是因为看到网上的教程写得很简洁漂亮,所以学的Markdown。个人感觉Markdown是一种学会了就回不去的语法,特别方便简洁。

1122
来自专栏运维小白

5.7 vim实践

多练习,记好笔记 # cp /etc/dnsmasq.conf /tmp/1.txt (1) 分别向下、向右、向左、向上移动6个字符(6j 6l 6h 6k...

16910
来自专栏ytkah

css自动换行如何设置?url太长会撑开页面

  我们更新文章时如果有引用其他文章一般会带一个原文url,但这个链接如果太长的话会把内容的版块撑开,整个排版乱了。那我们能不能设置css自动换行呢?如下图所示...

2575
来自专栏ios 技术积累

ios Charts MarkerView遇到的一个问题

两个问题 问题1:最大值的的时候 MarkerView 坐标有问题 ,原因就是最大值的时候,曲线已经在View的顶部了,所以MarkerView 的Y坐标还要...

1433
来自专栏云端漫步

vim 使用教程

定义映射模式时,我们可以使用nmap、imap、vmap来定义映射仅在normal、insert、visual模式有效

1904
来自专栏梦魇小栈

工具使用篇之Markdown

实时预览工具只是为了达到所见即所得的效果而已, 适合初学者学习 Markdown , 我们真正在进行写作的时候,其实是不需要实时预览的, 因为 Markdown...

822
来自专栏北京马哥教育

【基础拾遗】编辑器之神-VIM

在这天地间,流传这两大神器的故事:据说Emacs是神的编辑器,而Vim是编辑器之神。正所谓,工欲善其事,必先利其器。今天就和大家分享一下关于编辑器之神Vim的传...

2715
来自专栏淡定的博客

markdown基础语法

562
来自专栏Albert陈凯

2018-09-03 简单问题:VIM中 查找 “上一个” 的快捷键是什么?G 移动光标到指定行#. 例如: 5G-> 光标下反向搜索关键词 (search the word under cursor

https://blog.csdn.net/qq_31307253/article/details/78652494

1241
来自专栏Echo is learning

常用Markdown公式整理 && 页内跳转注意 && Markdown preview

1715

扫码关注云+社区