博客文章自用代码片段分享

分享几段在写博客文章时，自己常用的几个代码片段。

一、章节引用

hexo插件

适用于注明转载引用来源。

代码示例

{% blockquote 鲁迅 http://about:blank 空白页 %}
其实地上本没有路，走的人多了，也便成了路。
{% endblockquote %}

效果

其实地上本没有路，走的人多了，也便成了路。

鲁迅空白页

二、简单内容折叠

Html代码

可折叠文章内容适用于折叠一些不太重要的内容。缺点：标签内不再支持markdown语法。

代码示例

<details>
  <summary>折叠小标题</summary>
  内容content
</details>

效果

折叠小标题

内容content `markdown tag`

三、内容左右分栏

Html代码

适用于在效果展示的时候，分别展示实现前和实现后的效果对比。缺点：标签内不再兼容markdown语法。

代码示例

<table style="margin-left: auto; margin-right: auto;width:100%;border: none;">
    <tr>
        <td>
            <!--左侧内容-->
            左侧内容
        </td>
        <td>
            <!--右侧内容-->
            右侧内容
        </td>
    </tr>
</table>

效果

左侧内容

右侧内容

四、DartPad

Html代码 iframe

来自dart语言官网的在线演示工具，需要引用外部网页链接，适用于在线debug一些简单的dart语句，即时演示效果。

同样，也可以用来debug一些简单的Flutter页面。

代码示例

<!-- dart & Flutter dartpad -->
<iframe
 src="https://dartpad.cn/"
 style="min-height: 600px;width: 100%;"
 frameborder=0>
</iframe>

效果

参考

1. 参考资料1 ↩
2. 参考资料2 ↩