您的位置：首页 > 其它

CSDN Markdown简明教程3-表格和公式

2015-11-12 18:36 363 查看


0. 目录

目录
前言
表格
1 表格
2 表格对齐方式

公式
1 行内公式
2 陈列公式displayed formulas
3 MathJax语法

深入
声明

1. 前言

Markdown是一种轻量级的标记语言，把作者从繁杂的排版工作中解放出来，实现易读易写的文章写作，已经逐渐成为事实上的行业标准。CSDN博客支持Markdown可以让广大博友更加专注于博客内容，大赞。但是，不少博友可能对Markdown比较生疏，本博接下来用一个系列文章《Markdown简明教程》扼要介绍Markdown，希望可以对大家有所帮助。

系列教程目录

关于Markdown
Markdown基本使用
Markdown表格和公式
Markdown UML图
CSDN Markdown快速上手
Markdown 参考手册
本文为《Markdown简明教程》系列教程的第3篇Markdown表格和公式，主要讲解Markdown实现表格、公式。下一篇文章我们来研读Markdown UML图。

2. 表格

2.1 表格

Markdown使用管线图的方式实现表格，表格里面可以使用强调、链接等行内格式。

下面代码所示为一个基本的表格：

<code class="language-markdown hljs  has-numbering">教程标题| 主要内容
<span class="hljs-horizontal_rule">-------|----------</span>
关于Markdown | 简介Markdown，Markdown的优缺点
Markdown基础 | Markdown的<span class="hljs-strong">**基本语法**</span>，格式化文本、代码、列表、链接和图片、分割线、转义符等
Markdown表格和公式 | Markdown的<span class="hljs-strong">**扩展语法**</span>，表格、公式</code><ul style="display: block;" class="pre-numbering"><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li></ul>

解析html如下：

<code class="language-html hljs  has-numbering"><span class="hljs-tag"><<span class="hljs-title">table</span>></span>
<span class="hljs-tag"><<span class="hljs-title">thead</span>></span>
<span class="hljs-tag"><<span class="hljs-title">tr</span>></span>
<span class="hljs-tag"><<span class="hljs-title">th</span>></span>教程标题<span class="hljs-tag"></<span class="hljs-title">th</span>></span>
<span class="hljs-tag"><<span class="hljs-title">th</span>></span>主要内容<span class="hljs-tag"></<span class="hljs-title">th</span>></span>
<span class="hljs-tag"></<span class="hljs-title">tr</span>></span>
<span class="hljs-tag"></<span class="hljs-title">thead</span>></span>
<span class="hljs-tag"><<span class="hljs-title">tbody</span>></span>
<span class="hljs-tag"><<span class="hljs-title">tr</span>></span>
<span class="hljs-tag"><<span class="hljs-title">td</span>></span>关于Markdown<span class="hljs-tag"></<span class="hljs-title">td</span>></span>
<span class="hljs-tag"><<span class="hljs-title">td</span>></span>简介Markdown，Markdown的优缺点<span class="hljs-tag"></<span class="hljs-title">td</span>></span>
<span class="hljs-tag"></<span class="hljs-title">tr</span>></span>
<span class="hljs-tag"><<span class="hljs-title">tr</span>></span>
<span class="hljs-tag"><<span class="hljs-title">td</span>></span>Markdown基础<span class="hljs-tag"></<span class="hljs-title">td</span>></span>
<span class="hljs-tag"><<span class="hljs-title">td</span>></span>Markdown的<span class="hljs-tag"><<span class="hljs-title">strong</span>></span>基本语法<span class="hljs-tag"></<span class="hljs-title">strong</span>></span>，格式化文本、代码、列表、链接和图片、分割线、转义符等<span class="hljs-tag"></<span class="hljs-title">td</span>></span>
<span class="hljs-tag"></<span class="hljs-title">tr</span>></span>
<span class="hljs-tag"><<span class="hljs-title">tr</span>></span>
<span class="hljs-tag"><<span class="hljs-title">td</span>></span>Markdown扩展<span class="hljs-tag"></<span class="hljs-title">td</span>></span>
<span class="hljs-tag"><<span class="hljs-title">td</span>></span>Markdown的<span class="hljs-tag"><<span class="hljs-title">strong</span>></span>扩展语法<span class="hljs-tag"></<span class="hljs-title">strong</span>></span>，表格、公式、UML图<span class="hljs-tag"></<span class="hljs-title">td</span>></span>
<span class="hljs-tag"></<span class="hljs-title">tr</span>></span>
<span class="hljs-tag"></<span class="hljs-title">tbody</span>></span>
<span class="hljs-tag"></<span class="hljs-title">table</span>></span></code><ul style="display: block;" class="pre-numbering"><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li><li>7</li><li>8</li><li>9</li><li>10</li><li>11</li><li>12</li><li>13</li><li>14</li><li>15</li><li>16</li><li>17</li><li>18</li><li>19</li><li>20</li><li>21</li><li>22</li></ul>

在网页中结果如下：

教程标题主要内容
关于Markdown简介Markdown，Markdown的优缺点
Markdown基础Markdown的基本语法，格式化文本、代码、列表、链接和图片、分割线、转义符等
Markdown表格和公式Markdown的扩展语法，表格、公式
注意，为了美观起见，可以把前后端管线补齐，如下面代码所示。

<code class="language-markdown hljs  has-numbering">|  教程标题   | 主要内容                      |
|------------|------------------------------|
|关于Markdown | 简介Markdown，Markdown的优缺点|
|Markdown基础 | Markdown的<span class="hljs-strong">**基本语法**</span>，格式化文本、代码、列表、链接和图片、分割线、转义符等|
|Markdown扩展 | Markdown的<span class="hljs-strong">**扩展语法**</span>，表格、公式、UML图|</code><ul style="display: block;" class="pre-numbering"><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li></ul>

注意，表头下面的虚线为了更好的分隔表头和表格内容，长度随意。

2.2 表格对齐方式

注意，我们同时可以指定表格单元格的对齐方式，如下面代码所示。

<code class="language-markdown hljs  has-numbering">| Day     | Meal     | Price   |
|:--------|---------:|:-------:|
| Monday  | pasta    | $6      |
| Tuesday | chicken  | $8      |</code><ul style="display: block;" class="pre-numbering"><li>1</li><li>2</li><li>3</li><li>4</li></ul>

显示在网页上结果为：

DayMealPrice
Mondaypasta$6
Tuesdaychicken$8
注意，表格列的宽度设置不能设置。Markdown更加关注内容，因此格式设置性能较弱，如果确实需要设置，请使用CSS。

3. 公式

通过使用MathJax，我们可以让Markdown解析LaTeX数学表达式，通常情况下，我们需要引入MathJax插件才可能工作。

<code class="language-html hljs  has-numbering"><span class="hljs-tag"><<span class="hljs-title">script</span> <span class="hljs-attribute">type</span>=<span class="hljs-value">"text/javascript"</span> <span class="hljs-attribute">src</span>=<span class="hljs-value">"https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML"</span>></span><span class="javascript"></span><span class="hljs-tag"></<span class="hljs-title">script</span>></span></code><ul style="display: block;" class="pre-numbering"><li>1</li></ul>

CSDN已经内置了这个插件，我们就不需要手动插入了，可以直接写数学公式了。

3.1 行内公式

我们使用
$...$
的方式来包含行内公式，例如

<code class="language-markdown hljs  has-numbering">一个简单的数学公式,求圆的面积$S=\pi r^2$。</code><ul style="display: block;" class="pre-numbering"><li>1</li></ul>

编译之后表现在网页上，结果为：

一个简单的数学公式,求圆的面积S=πr2。

3.2 陈列公式（displayed formulas）

陈列公式使用
$$...$$
来表示，例如。

<code class="language-markdown hljs  has-numbering">如果使用陈列公式，结果为：
一个简单的数学公式，求圆的面积。
$$
<span class="hljs-code">	S=\pi r^2</span>
$$</code><ul style="display: block;" class="pre-numbering"><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li></ul>

解析在网页上结果为：

一个简单的数学公式，求圆的面积。

S=πr2

3.3 MathJax语法

使用\alpha、\beta、\gamma表示希腊字母α、β、γ， 使用\Gamma表示大写希腊字母Γ等，如下表所示。
字母实现字母实现
A
A
α
\alhpa
B
B
β
\beta
Γ
\Gamma
γ
\gamma
Δ
\Delta
δ
\delta
E
E
ϵ
\epsilon
Z
Z
ζ
\zeta
H
H
η
\eta
Θ
\Theta
θ
\theta
I
I
ι
\iota
K
K
κ
\kappa
Λ
\Lambda
λ
\lambda
M
M
μ
\mu
N
N
ν
\nu
Ξ
\Xi
ξ
\xi
O
O
ο
\omicron
Π
\Pi
π
\pi
P
P
ρ
\rho
Σ
\Sigma
σ
\sigma
T
T
τ
\tau
Υ
\Upsilon
υ
\upsilon
Φ
\Phi
ϕ
\phi
X
X
χ
\chi
Ψ
\Psi
ψ
\psi
Ω
\v
ω
\omega
2. 利用{}实现优先级。

例如
$ x_i^2 $
实现x2i，而
$
x_{i^2} $
实现xi2。

例如
$ \lim_{x\to\infty} $实现
limx→∞。

3. 常用数学运算符表示如下。

运算符说明运算符案例案例实现
+加x+y
$ x + y $
-减x−y
$ x - y $
\times乘x×y
$ x \times y $
\cdot乘x⋅y
$ x \cdot y $
\ast乘x∗y
$ x \ast y $
\div除x÷y
$ x \div y $
\frac分数xy
$ \frac{x}{y} $
^上标xy
$ x ^ y $
_下标xy
$ x _ y $
\sqrt开二次方x√
$ \sqrt x $
\sqrt开方y4+3y−1−−−−−−−−−√x
$ \sqrt[x]{y^4+3y-1} $
\pm加减x±y
$ x \pm y $
\mp减加x∓y
$ x \mp y $
=等于x=y
$ x = y $
\leq小于等于x≤y
$ x \leq y $
\geq大于等于x≥y
$ x \geq y $
\ngeq不大于等于x≱y
$ x \ngeq y $
\not\geq不大于等于x≱y
$ x \not\geq y $
\neq不等于x≠y
$ x \neq y $
\approx约等于x≈y
$ x \approx y $
\equiv恒等于x≡y
$ x \equiv y $
\bigodot定义运算符x⨀y=x+y2
$ x \bigodot y=x+y^2 $
\bigotimes定义运算符x⨂y=x+y2
$ x \bigotimes y=x+y^2 $
\in属于x∈y
$ x \in y $
\notin不属于x∉y
$ x \notin y $
\subset子集x⊂yx⊂y
\not\subset非子集x⊄yx⊄y
\subseteq子集x⊆yx⊆y
\supset超集x⊃yx⊃y
\supseteq超集x⊇yx⊇y
\cup并x∪y
$ x \cup y $
\cap交x∩y
$ x \cap y $
\log对数log(x)
$ \log(x) $
\overline平均数x¯
$ \overline{x} $
\overline连线符号a+b+c+d¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
$ \overline{a+b+c+d} $
\underline下划线a+b+c+d−−−−−−−−−−
$ \underline{a+b+c+d} $
\overbrace上大括号a+b+c1.0+d2.0
$\overbrace{a+\underbrace{b+c}_{1.0}+d}^{2.0}$
\underbrace下大括号a+d3|
$\underbrace{a+d}_3$
\partial部分∂x∂y
$ \frac{\partial x}{\partial y} $
\lim极限limx→∞
$ \lim_{x\to\infty} $
\displaystyle块公式格式limx→∞
$ \displaystyle \lim_{x\to\infty} $
\sum求和∑n1
$ \sum_1^n $
\infty极限∑∞i=0i2
$ \sum_{i=0}^\infty i^2 $
\int积分∫10x2dx
$ \int_0^1 x^2 {\rm d}x $
\ldots底端对齐的省略号1,2,…,n
$ 1,2,\ldots,n $
\cdots中线对齐的省略号x21+x22+⋯+x2n
x_1^2 + x_2^2 + \cdots + x_n^2
\uparrow上箭头↑
$ \uparrow $
\Uparrow上箭头⇑
$ \Uparrow $
给个小作业：

Γ(z)=∫∞0tz−1e−tdt.
本文为《Markdown简明教程》系列教程的第3篇Markdown表格和公式，主要讲解Markdown实现表格、公式。下一篇文章我们来研读Markdown UML图。

4. 深入

MathJax官方网站
MathJax手册
MathJax使用LaTeX语法编写数学公式教程
Mathjax与LaTex公式简介
小敏纸的博文

5. 声明

前端开发whqet，关注前端开发，分享相关资源。csdn专家博客，王海庆希望能对您有所帮助，限于作者水平有限，出错难免，欢迎拍砖！

欢迎任何形式的转载，烦请注明装载，保留本段文字。
本文原文链接，http://blog.csdn.net/whqet/article/details/44277965

欢迎大家访问独立博客http://whqet.github.io
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航