本文主要包括Markdown的特殊语法，一些还与Hexo的特定Markdown渲染方式有关，在网上不是很方便查找，因此记录下来。

Markdown语法

  • md文件头设置
    1
    2
    3
    4
    title: 标题
    date: YYYY-MM-DD HH:mm
    tags: 分类标签
    toc: true

注1：toc为是否生成目录，默认不生成
注2：Hexo默认按文章时间来排序

  • 书写格式
    每一章的大标题用##二级标题，之后依次是###、####。

  • 插入链接/图片

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    插入链接
    [显示文本](链接地址)
    eg : [简书](http://www.jianshu.com)
    页面内跳转也是相同的语法：[显示文本](#相应目录名)

    插入图片
    ![](/images/图片名.xxx)
    将图片直接放到images文件夹下即可，图片必须加后缀，否则识别不出来。

    若要控制图片大小，使用HTML标签
    <img src="/images/图片名.xxx" width = "300" height = "200" alt="图片名称" align=center />

    在chrome Markdown Preview plus 插件中无法使图片居中，可使用<div>标签
    <div align=center>
    <img src="图片地址" width = "300" height = "300"/><br>
    图x 图片名字
    </div>

  • 插入表格

    1
    2
    3
    4
    5
    6
    | Tables        | Are           | Cool  |
    | ------------- |:-------------:| -----:|
    | col 3 is      | right-aligned | $1600 |
    | col 2 is      | centered      |   $12 |
    | zebra stripes | are neat      |    $1 |
    靠左对齐、居中、靠右对齐

效果：

Tables Are Cool
col 3 is right-aligned $1600
col 2 is centered $12
zebra stripes are neat $1

注1：hexo/github的markdown不支持列表list嵌套表格。
注2：一级列表中写表格要空一行（否则表格解析不出来），二级列表中就不要写表格了。
注3：表格内换行，使用html代码<br>
注4：miho主题下表格各列的宽度是根据内容多少来动态决定的，因此最好保证各列内容差不多，多的列用<br>换行，少的列用&nbsp;加空格（只用在某一行里加就行了）

  • 转义符号
    要使用* _ #等符号，但不想被翻译为格式标识符，可在符号前加反斜杠，如\_ \*
    注1：* _为加粗/斜体格式
    注2：markdown中反斜杠和普通字母组合时，如\abc，\不起作用；但反斜杠和特殊字符组合时，如\*，\就会起到转义作用。

零碎记录

  • 分隔线
    三个星号***表示分隔线

  • 插入代码：
    行内代码为前后一个上点，插入代码块是前后三个上点，代码块第一个三点后加C进行语法高亮。

  • 插入空格：
    半角英文空格：&nbsp;
    全角中文空格：&emsp;，注意单词后的分号。

  • 语法高亮
    Hexo语法高亮支持C语言，其他语言也凑合着用C语言的语法高亮吧。

  • VSCode中快捷键ctrl+B添加****，对字体进行加粗

hexo 主题

hexo是一款基于node js的博客框架，本质作用就是将markdown渲染称html代码

miho主题

  • 修改字体：source/css/_variables.styl的font-family属性。
    “PT Serif”：MacOSX的英文默认字体（因为中间有空格，所以加"使之称为一个整体），STHeitiSC-Medium：MacOSX的中文默认字体
    将PT写前面，优先匹配英文字体，遇到中文时匹配不到，即向后搜索，以此来达到中英文不同字体的效果。

    1
    font-family = "PT Serif", STHeitiSC-Medium

  • 滚动条样式：source/css/_partial/scroll.styl

  • 修改图片样式：source/css/_partial/article.styl
    1
    2
    3
    4
    5
    6
    7
    8
    9
    p img, p video
        zoom: 0.6  // 缩放图片
        max-width: 80% // 图片占屏幕最长宽度
        height: auto
        display: block
        margin: 1em auto // 上下1em，左右居中的margin
        box-shadow: 0 0 30px #ccc
        -moz-box-shadow: 0 0 30px #ccc
        -webkit-box-shadow: 0 0 30px #ccc

Post Date： 2018-01-19

版权声明： 本文为原创文章，转载请注明出处