附上一个优秀的博客链接

钻石

  我们都知道markdown可以嵌入html代码的。比如想把一段文字加个背景色。可以这样写(直接写就行):

1
<p style="background-color: #f00;">一段文字<p>

效果:

一段文字


。可见,它完全按照自己的想法执行。这是高级一点的用法。
  下图是一个例子

1
<p style="color: #0f0;">外联style<p>

而前面的标题使用markdown语法写的。结果理想。不过左侧有点问题,就是标题的问题。就是我们使用标题的时候,一定要先出现高级标题,然后才能出现低级标题(正常的思路,类似文章的章节一样)。文档使用的模板是MIHO。

title有小问题
  下图是高级用法的一个例子:

你没有看错,所有的标签与markdown的标志都正确的解析了!!
perfect
相关部分源码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
More info: [Generating](https://hexo.io/docs/generating.html)

### Deploy to remote sites

*** bash
$ hexo deploy
***

More info: [Deployment](https://hexo.io/docs/deployment.html)

<div style="background-color: #f00;">内联style</div>
---
# 又一个title
---
<h2 class="headerlink">h2标签</h2>
<link href="../../../../css/test.css" rel="stylesheet" />
<div id="outCSS">外联style</div>
# 再来一个title

  至此,你可能会觉得,哦,原来混合编辑这么简单!对钻石就这么简单。

  再看一个例子:
下图中的点图都是可以交互的!所以他们肯定是一个大的div。我们可以看到,最左侧的标题5,是没有正确解析的,不止如此,我又在div的两头各加了一个<br>。经检查发现,文档中某些地方出现非标准的标签比如<dt-div></dt-div> 。但是可以肯定的是下图中的几个标签都是div
markdown "Bug"

王者

  我把这些非标准的标签都换成div后,网页形式就变成了这样https://www.xunhanliu.top/2018/07/07/md+html_complex/
不像我们一开始想的那样。第一个大div后的markdown标签都没有正确解析,而像把它们放在了p标签里了一样。不过这已经很接近我们的布局了:加几个<br> ,把标题手动更改成h标签。

  所以结论是,简单的标签直接写就能完美解析,像div这种高级标签,此标签后面的内容,一般不会得到markdown编译。

附:不一定是.md后缀,也可以是.html后缀

  对于复杂的笔记,不一定要用markdown语法去写,我可以全部使用html。不过有些人可能觉得有点麻烦。这里提供一个新的思路:先用markdown写出大体的框架来,把写div标签的空间留下来。然后编译,找到编译后的文件,复制粘贴。笔记后缀名不一定是.md,也可以是html
见:https://www.xunhanliu.top/2018/07/06/t-sne_how_use .
不过你可以使用前面的方法编写,更加简单!

说明:这一篇我用了大概3个小时去找bug,前面那一篇我只用了两分钟。可能是有做完第一篇的基础吧。不过使用先编译,再复制粘贴的方法,容易在标签开闭、漏写上犯错(me too!),况且使用hexo编译后也不报错(可能觉得,大不了我把你这全部便签都看成普通文本)。然后访问网址,出现了一个奇葩的错误,浏览器竟然改了我某个js文件。。。各种心酸历程!

附2:爬网页文件:webzip ,绝对良心软件!

最后更新: 2018年07月11日 22:21

原始链接: https://www.xunhanliu.top/2018/07/07/advanced-markdown/

× 请我吃鸡
打赏二维码