Markdown 基本语法

等级:⭐⭐        难度:⭐        趣味性:⭐⭐


简介

基本语法指创造者 John Gruber 最初设计的原始语法,在 官网 有详细的描述,几乎所有的 Markdown 应用都支持基本语法,所以可以很放心地使用它们。

大约有 12 种基本语法,而且用法都比简单。

标题 Headings

Markdown 标题有两种表示方法:Atx-style HeadingsSetext-style Headings 。常用的是 Atx-style Headings。

Atx-style Headings

添加 1-6 个井号 ( # ) 在行首,表示标题一到标题六,井号的数量代表标题的级别。比如创建一个标题 <h3>,只要在标题前输入三个井号 ( ### 这是标题 )。仔细观察转换后的 HTML 标签发现,Markdown 标题级别刚好和 HTML <h> 标签一一对应。

<table>
<thead>
<tr>
<th>Markdown</th>
<th>HTML 标签</th>
</tr>
</thead>
<tbody>
<tr>
<td><code># 这是一号标题</code></td>
<td><code><h1>这是一号标题</h1></code></td>
</tr>
<tr>
<td><code>## 这是二号标题</code></td>
<td><code><h2>这是二号标题</h2></code></td>
</tr>
<tr>
<td><code>### 这是三号标题</code></td>
<td><code><h3>这是三号标题</h3></code></td>
</tr>
<tr>
<td><code>#### 这是四号标题</code></td>
<td><code><h4>这是四号标题</h4></code></td>
</tr>
<tr>
<td><code>##### 这是五号标题</code></td>
<td><code><h5>这是五号标题</h5></code></td>
</tr>
<tr>
<td><code>###### 这是六号标题</code></td>
<td><code><h6>这是六号标题</h6></code></td>
</tr>
</tbody>
</table>

image-20210202134853010

另外,可以选择关闭 Atx-style Headings,同样在结尾加上井号,如:### 这是三号标题 ### 。虽然这样显得更加清晰,但是没必要这么做。

Setext-style Headings

在标题下使用任意数量的 == 符号表示一号标题,-- 符号表示二号标题,它只能表示两级标题,而且比较繁琐,一般情况下不用。

image-20210202134641092

Headings 最佳实践

有些 Markdown 应用不知道如何处理井号 ( # ) 和标题名称之间缺少空格的情况,所以为了兼容,始终要在井号 ( # ) 和标题名称中间打一个空格,其实这也是一种优秀的习惯。但是空格不需要多,只要一个,较多空格会导致标题缩进不一致,影响阅读和排版。

<table>
<thead>
<tr>
<th>✅  正确</th>
<th>❌  正确</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<code>
# 一号标题
</code>
</td>
<td>
<code>
#一号标题
</code>
</td>
</tr>
</tbody>
</table>

段落 Paragraphs

创建段落是最简单的,用一个或者多个空行隔开就可以了。

<table>
<thead>
<tr>
<th>Markdown</th>
<th>HTML 标签</th>
<th>渲染输出</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<code>
段落一......<br /><br />
段落二......
</code>
</td>
<td>
<code><p>段落一......</p><br /><br />
<p>段落二......</p></code>
</td>
<td>
<p>段落一......</p>
<p>段落二......</p>
</td>
</tr>
</tbody>
</table>

image-20210202134543041

段落最佳实践

在段落开头不要用缩进,比如 空格 或者 Tab 符号

<table>
<thead>
<tr>
<th>✅  正确</th>
<th>❌  错误</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<code>
段落开头不需要空格或 Tab 符号
</code>
</td>
<td>
<code>
    这里有空格是错误示例
</code>
</td>
</tr>
</tbody>
</table>

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容