最近看很多别人的博客，排版什么的都特别漂亮，但是又感觉写博客时花太多时间排版不是很必要.希望将注意力更多的放到写作内容上面.如何更好更快地排版呢？可以看看我发现的一些技巧和工具.

需求分析

1. 文字格式
文字需要支持简单的格式变化，比如加粗，斜体，引用，代码块.
2. 公式编辑
作为工科生，学习的东西免不了需要写公式，如何在博客中优雅的显示公式也是一个重要问题.
3. 插图，表格
很多时候，一张图（表格）胜过千言万语，满屏的字可能不如一张图来的清晰明了，所以方便的插图也很重要.
4. 兼容性
这里的兼容性指的是，本地编辑的样式和最终发表后的样式不要有太大出入，否则对于强迫症患者来说真的很痛苦.

工具选择

我是希望能够本地编辑，然后直接发布，试了好几个工具效果都不太理想.

Atom：可以实时预览，但是插图特别麻烦.可以用插件解决，但是下载插件功能被墙了...装插件就很麻烦.
参阅使用Atom打造无懈可击的Markdown编辑器
OpenLiveWriter:可以本地编辑，然后直接发布，图片也很好插入，但是缺点在于文字格式调整起来很麻烦，容易让人把注意力都放在格式美观上而不是内容.效率低下.当然好像这软件也可以装Markdown插件，但是实在懒得折腾了.
参阅使用WindowsLiveWriter编辑博客
所以折腾来折腾去，还是暂时用博客园自带的编辑器吧...(但是在线编辑器总是觉得不放心，而且有时候可能没网)

公式编辑

方案一：office系列软件+复制粘贴

其实在新版本的office系列软件中，对公式的支持已经非常好了，直接使用alt+=即可方便的编辑公式，语法类似于latex，并且可以实时预览.
参阅 Word - 快速输入数学公式.
OneNote当中编辑好的公式，直接复制粘贴到博客园的markdown在线编辑器，自动上传为图片.
效果如下：

方案二：博客园Latex功能

参阅在博客园使用LaTeX数学公式
效果如下
$\underbrace{a+\overbrace{b+\dots+b}^{m\mbox{\tiny 个}}}_{20\mbox{\scriptsize 个}}$

页内跳转

假如你写的文章比较长，那么他很需要一个小目录，就像本文目录一样，可以实现各个部分的跳转，方便读者阅读.
是这样实现的：

目录中每一个标题都增加一个链接，如下所示
在正文标题使用html标签，并增加一个id

这样就ok啦！简单的解释一下：
这其实就是Markdown内嵌HTML的用法，除了自带的语法之外，你还可以插入各种HTML标签来实现你想要的效果.类似的你还可以通过HTML标签去改变字体，改变图片大小等等.
参阅 HTML文档

引用图片及修改图片大小、格式

参阅 MarkDown 图片大小问题

笔记快速排版发布

我希望可以一边学习，一遍做笔记，然后顺便编辑博客，这要怎么办呢？其实也没有特别好的办法.暂时的办法是：

学习的时候用印象笔记记录，可以很随意
之后有时间再排版，直接把文本复制到markdown编辑器，然后简单排版即可（图片还是需要一幅幅插入）

之前看到另一种方法：印象笔记里使用Markdown,但是感觉印象笔记的在线编辑太烂，就没用
20181004update:现在找到了一个非常好用的工具“小书匠”很符合我的要求！而且很多工作不需要自己手写代码了，强烈推荐！

参考资料

使用Atom打造无懈可击的Markdown编辑器
使用WindowsLiveWriter编辑博客
Word - 快速输入数学公式
在博客园使用LaTeX数学公式
MarkDown 图片大小问题
印象笔记里使用Markdown
Markdown 添加 Latex 数学公式
Markdown文档

祝写作愉快！

转载于:https://www.cnblogs.com/Howfars/p/8384070.html

博客园Markdown排版技巧相关推荐

改进博客园Markdown显示功能(加代码行号、显示代码所用编程语言)
博客园的markdown模式下的代码高亮功能使用的是highlight.js,没有行号和显示相应编程语言的功能,只好自己将其改造了一下(将这两种功能一并实现了)~ 先看一下效果,再详细介绍方法~ 查看 ...
markdown mysql高亮_修改博客园markdown编辑器代码高亮风格的方法
作为一个工程师,追求极致与艺术也应当成为我们生活中的一部分,作为自己的心爱之物--博客,当然也得装扮一下,我对代码高亮有自己所喜欢的风格~还好程序员的世界总是共通的,已经有前辈开发了一些代码高亮的样式 ...
博客园Markdown模式的MATLAB代码高亮方案
前言博客园随笔写作可以使用 Markdown 进行编辑,当展示代码时,可以使用下面的语法来对代码块进行展示: ```language code-content ``` 一般来说,指明了 lang ...
GFM与博客园markdown测试
博客园流程图 st=>start: Start e=>end op=>operation: My Operation cond=>condition: Yes or No?st ...
博客园markdown公式
博客园插入公式有以下要点: $formula$表示行内公式 $$formula$$表示块级公式使用图片表示公式,知乎也是使用图片表示公式,虽然有一种mathML的标记语言能够表示公式,但是不同浏览器 ...
博客园markdown语法扩展
从Markdown语法解析说起 Markdown作为一种非常轻便的标记语言,非常适合博客的写作.其语法十分简单,一般都是一些特殊的字符组合来实现特定的语法,比如一级标题.二级标题,插图.插表等等.这些 ...
博客园Markdown新建笔记
这是一个一级标题测试下面插入一段Python代码 import osfrom PIL import Image from numpy import * from pylab import *path ...
测试博客园Markdown 表格
$1\times 1$ 表格: 代码: | 单格 | | ----- | 效果: $1\times 2$ 表格: 代码: | 第一格 |第二格| | ----- |------| 效果: \( ...
博客园markdown体验太差，溜了
是这样转载于:https://www.cnblogs.com/QEStack/p/8631166.html

博客园Markdown排版技巧

目录