如何在Web开发中使用Markdown

null

作为Web开发人员和内容创建者,我们通常会花很多时间编写包含在其中的文本HTML码。如果我们告诉您使用Markdown有更好的方法,该怎么办?您能够专注于写作而不是代码的方式吗?

Markdown是一种纯文本的轻量级标记语言,由John Gruber和Aaron Swartz于2004年开发。最初创建的目的是通过将纯文本文件转换为结构有效的HTML或XHTML来简化XHTML / HTML编写,Markdown几乎可用于任何类型的写作:手稿,教程,笔记,Web内容等。

尽管相对简单,Markdown在您刚开始时可能会有点吓人。但是,一旦掌握了它,您就会很快意识到格式化代码所花费的时间,而不是键入内容。

01.选择Markdown编辑器

当您使用Markdown进行网络处理时,了解您可能面临的基本语法和限制非常重要。在开始之前,您需要某种类型的编辑器和您的站点的解释器。或者,您可以在发布之前转换Markdown。

You'll need some kind of editor to get started

你需要某种编辑器才能开始使用

您可以选择几种编辑器。格言很棒,因为它提供了广泛的导出选项,包括HTML和PDF。另一个很好的选择是StackEdit- 一个免费的在线Markdown编辑器。当然,任何纯文本编辑器都可以使用。

Jetpack is handy for use with WordPress

Jetpack可以方便地与WordPress一起使用

如果您不打算将Markdown转换为HTML,则可以为您的网站获取插件(或中断器)。对于WordPress,Jetpack的对Markdown提供出色的支持,允许您直接在帖子和评论中使用Markdown - 只要您启用该选项。

与任何标记语言一样,Markdown也有自己的语法。注意:Markdown有许多不同的口味或种类。在本文中,我们将仅介绍常用的语法。

02.设置标题

在HTML中,有六种标题样式:H1H2H3H4H5H6。要在Markdown中重新创建这些,请使用一系列#标签符号() - 对应标题号 - 后跟标题文本。例如,创建一个

标记,使用一个标签;为

标记,使用两个主题标签##;等等等等。

降价输入:

#标题1 ##标题2 ###标题3 ####标题4 #####标题5 ######标题6

HTML输出:

标题1

标题2

标题3

标题4

标题5
标题6

03.标记段落

段落由代表

HTML中的标记。在Markdown中,它们被一个或多个空行隔开。与HTML一样,空格被忽略。因此,如果你添加20个空行,你仍然只会有一个段落。

降价输入:

敏捷的棕色狐狸跳过了懒狗。懒狗不在乎,因为他是一只懒狗。

HTML输出:

敏捷的棕色狐狸跳过了懒狗。

懒狗不在乎,因为他是一只懒狗。

04.设置换行符

换行符,用HTML表示
标记,使用单个换行符添加,在前一行的末尾有两个空格。

降价输入:

敏捷的棕色狐狸跳过了懒狗。

HTML输出:

快速的棕色狐狸
跳过懒狗。

05.马克强调

有两种方法可以强调你的文字:Italic(在HTML)或大胆(在HTML中)。

在Markdown中,您可以使用一个或两个星号来完成此操作(*)。您也可以使用下划线(_),但我坚持使用星号,因为还有其他类型的Markdown使用下划线来表示其他内容。

降价输入:

*斜体文字* **粗体文字**

HTML输出:

斜体文字 粗体文字

注意:您还可以使用三个星号创建粗体斜体文本:***大胆和斜体文字***

06.创建横向规则

创建水平规则(或


在HTML)中,使用一系列三个或更多连字符(---),星号(***)或等号(===)。您可以根据自己的喜好选择哪一种,但请确保在上方和下方包含空行。

降价输入:

学习新东西总是很有趣。 - - 确实是!

HTML输出:

学习新东西总是很有趣。


确实是!

在HTML中,使用。添加图像标签和链接使用标签。

在Markdown中,图像以感叹号开头(),后面是方括号([])'替代文字'和括号(())用于图像的路径。您还可以在双引号内包含可选标题(“”)。

有了链接,它几乎是一样的,除了没有感叹号。

降价输入:

![Alt Text](/ path / to / image.jpg“Optional Title”)[Link Text](http://example.com“Optional Title”)

注意:您也可以使用参考链接和图像,但这里没有介绍。

HTML输出:

Alt Text 链接文字

08.制作清单

HTML中有两种类型的列表:有序(

    )和无序的(
      )。使用Markdown,使用有序列表和星号的数字(*)或连字符(-)对于无序列表。

      降价输入:

      1.项目1 2.项目2 *第一项目*第二项目 - 第一项目 - 第二项目

      HTML输出:

      1. 第1项
      2. 第2项
      • 第一项
      • 第二项
      • 第一项
      • 第二项

      09.添加内联代码和代码块

      当您使用HTML中的代码时,您可以使用它将其包含为内联元素标签;或者作为预先格式化的文本块使用

      组合。

      在Markdown中,这些元素使用每侧的单个反引号分隔(`);或者使用围栏式,其中包括代码块上方和下方的三个反引号(```)。

      降价输入:

      `numberOfPoints`变量保存玩家的分数。如果是player.wins {numberOfPoints + = 1}

      HTML输出:

      numberOfPoints变量保存玩家的分数。 
        if player.wins { numberOfPoints += 1 } 

      10.设置块引用

      使用the在HTML中添加Blockquotes

      标签。在Markdown中,使用大于号(>)行前。

      降价输入:

      >这是我的blockquote。 >>这是同一块引用的一部分。 >这是一个新的blockquote。

      HTML输出:

      这是我的blockquote。


      这是同一块引用的一部分。

      这是一个新的blockquote。

      11.嵌入内联HTML

      有时您需要创建不受支持的HTML元素;例如,您可能需要一个

      要么
      标签。

      如果是这种情况,您可以混合Markdown和HTML,但有一些限制。例如,您不能在块级HTML标记中包含Markdown。

      阅读更多:



      翻译字数超限