Hexo的文章基于Markdown语法，本文给出一些作者尝试过的入门方法解决实际问题。
|分类|问题|备注| |—| |表格|Q：表格如何设置文字居中？|| ||Q：为什么每一个表格的效果不一样呢？|| ||Q：如何在表格内换行？|| ||Q：如何在表格中增加空格|| ||Q：如何在表格中合并单元格|| ||Q：我想做一个复杂的表格怎么办？|| ||Q：我想调整Markdown表格的列宽怎么做？|| |图片|Q：什么是图床？|| ||Q：如何调整图片的大小？|Html 七牛| ||Q：如何给图片增加超链接？|| |视频|Q：如何插入视频？|| |其他|Q：如何增加锚点？|| ||Q：markdown转义符号|| ||Q：链接的最后一个符号是括号怎么办？|| ||Q：想进一步了解，有哪些好的文章？|| ||Q：有没有更多小技巧？|| ||未解决问题| |
## 表格 ### Q：表格如何设置文字居中？ 关于左对齐、居中、右对齐，在语法中有详细说明。基于[Markdown表格基础语法](https://help.github.com/articles/organizing-information-with-tables/)，可以做出最基础的MD效果。 ### Q：为什么每一个表格的效果不一样呢？ 制表的差异要看引用的markdown的类型。基于[最早的Markdown](https://daringfireball.net/projects/markdown/)版本，有一些微小差异的版本陆续发布。另外，不同博客主题的CSS渲染也有可能影响到表格的展示效果。比如：有的表格可以根据字符数量自动调整每一列的表格宽度，有的不行。在表格的行格式不完整时展示方式不同，有一些表格直接无法生成，有的是会展示空行，有的表格是不完整的。不过这些都不影响到基础的使用。 ### Q：如何在表格内换行？ 在Hexo中Markdown语法的文件最终都会转换为html的文件形成静态页面展示。在不对博客设置做调整的前提下，可以变相的采用Html的语法变相解决问题。 在需要换行的位置增加如下代码即可。 ```````` ### Q：如何在表格中增加空格 同[“如何在表格内换行”](#br)，利用html特性解决问题。 在需要空格的位置增加如下代码即可。 ```` ```` ### Q：如何在表格中合并单元格 同[“如何在表格内换行”](#br)，利用html特性解决问题。简单的合并可以参考如下[代码](https://zhidao.baidu.com/question/1672474765568278347.html)。 ### Q：我想做一个复杂的表格怎么办？ 建议直接用html代码，如果你一定要做的话。这篇文章[Markdown之表格的处理](http://www.ituring.com.cn/article/3452)的方法有一些启发，利用[No-Cruft Excel to HTML Table Converter](http://pressbin.com/tools/excel_to_html_table/index.html)实现代码的转换和修改，减少工作量。 ### Q：我想调整Markdown表格的列宽怎么做？ 如果你的markdown不支持，就需要通过css的样式调整。可以考虑换成html的表格后套一个样式，不过我没有试过。有兴趣可以自行探索。 ## 图片 ### Q：什么是图床？ 为了在博客中显示图片，可以直接把图片上传到源码中，但是随着博客的内容不断增多，会增加博客的源码容量。Github空间有限，这样的上传下载并不是非常必要。替代办法是把图片上传到一个网络位置，既可以自己保存，又可以通过链接调用。这样的服务供应商提供的服务就是我们的博客的图床。提供该服务的有一些，我选用的是[七牛](http://www.qiniu.com/)，所以就用它举例： 1. 注册七牛账号，进行初步设置 2. 每次登陆七牛，上传图片，拷贝外链 3. 把外链用到自己的博客中。 ### Q：如何调整图片的大小？ markdown不能设置图片大小，用PS的方式调整不同的大小后上传图床略显复杂。有没有更好的办法呢？
| 方法 | 好处 | 坏处 |
|---|---|---|
| PS修改图片大小 | 调整大小 可以做其他设定 | 麻烦，需要多次上传 学习成本较高 |
| html修改 | 修改方便，不需要改动原图 可以直接饮用任何链接 | 链接源可能不稳定 学习成本较低：需要了解html语言 |
| 七牛接口输出 | 修改方便，不需要改动原图 可以做更多的设定 | 必须上传七牛 学习成本较低：需要了解七牛接口规则 |
html代码和展示效果
<img src="http://gxtech.gxcad.com/wp-content/uploads/2010/08/hero_4_20091020.jpeg" style="width:100px;height:100px;" />
如果想设置更多，可以做成如下的效果
<img src=http://gxtech.gxcad.com/wp-content/uploads/2010/08/hero_4_20091020.jpeg onload='if (this.width>140 || this.height>226) if (this.width/this.height>140/226) this.width=140; else this.height=226;'>
一般来说，只要修改这几个数值就可以初步实现效果：
- width表示宽
- height表示高
这是利用Markdown语法设置的图片大小
图片本身没有发生变化，唯一的区别是第二次加载图片的链接后面多了
?imageView/2/w/200/q/90
这是通过七牛提供的API接口图片基本处理 (imageView2)增加了一些参数的说明。
imageView2/<mode>/w/<LongEdge>
/h/<ShortEdge>
/format/<Format>
/interlace/<Interlace>
/q/<Quality>
/ignore-error/<ignoreError>
先确定mode，然后设置宽和高。一共有五种mode，简单总结如下：
|模式代码|长宽设置|简略说明|备注|
|—|
|0|缩略图的长边最多为
代码如下：
[](http://blog.junyu.pro)
原理：采用嵌套的方式，在[]()的超链接的前面的中括号中嵌入![]()即可。
** 腾讯视频的插入方法 **
<iframe height=498 width=650 src="http://v.qq.com/x/page/m0329872hrv.html" frameborder=0 allowfullscreen></iframe>
修改vid，就是代码中page后面的"m0329872hrv"为视频自己的id即可。Id可以在腾讯视频的网址链接中找到。
总的来说，不管是哪一种方法，仔细看代码会发现都是利用html的< iframe >标签特性。但是要注意，iframe框架不是越多越好，慎用。
## 其他 ### Q：如何增加锚点？ 锚点涉及到两个位置，一个是当你阅读到了A处，希望通过A处跳转到B处。 A处增加如下代码： ```` [锚点显示的文字](#anchor) ```` B处增加如下代码： ```` ```` anchor可以换成自己希望的文字，这个是一个锚点的标记，并不会在前台显示。原理可以参考[markdown中的锚点处理](http://www.cnblogs.com/ToDoToTry/p/4132175.html)中提到的[Markdown 语法说明](http://wowubuntu.com/markdown/)。 简单说就是Markdown转换超链接并不能很好的处理这个问题，但是可以结合html的标签处理。 ### Q：markdown转义符号 在需要转义的符号前增加反斜线即可。 ```` \* ```` ### Q：链接的最后一个符号是括号怎么办？ ```` [Aberration](https://en.wikipedia.org/wiki/Aberration_(film%29) ```` 最后一个字符是括号，换成ascii码"%29",用法如上图。 ### Q：想进一步了解，有哪些好的文章？### Q：有没有更多小技巧？### 未解决问题 - 如何把两个图片放在同一行，我还没有找到答案，直接用html的table效果不是非常理想。 ```` | |
[完](http://blog.junyu.pro)
声明: 本文转载需标明出处，禁止用于商业目的。
ChangeLog
161117 新建 161117 发布