整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:

MarkDown 速成

# 号可表示 1-6 级标题,一级标题对应一个 # 号,二级标题对应两个 # 号,以此类推。

# 一级标题

## 二级标题

### 三级标题

#### 四级标题

##### 五级标题

###### 六级标题


Markdown 段落没有特殊的格式,直接编写文字就好,段落的换行是使用两个以上空格加上回车

当然也可以在段落后面使用一个空行来表示重新开始一个段落。


Markdown 可以使用以下几种字体:

*斜体文本*

_斜体文本_

**粗体文本**

__粗体文本__

***粗斜体文本***

___粗斜体文本___


你可以在一行中用三个以上的星号、减号、底线来建立一个分隔线,行内不能有其他东西。你也可以在星号或是减号中间插入空格。下面每种写法都可以建立分隔线:

***

* * *

*****

- - -

----------


如果段落上的文字要添加删除线,只需要在文字的两端加上两个波浪线 ~~ 即可,实例如下:

~~BAIDU.COM~~


下划线可以通过 HTML 的 <u> 标签来实现:

<u>带下划线文本</u>


Markdown 支持有序列表和无序列表。无序列表使用星号(*)、加号(+)或是减号(-)作为列表标记:

* 第一项

* 第二项

* 第三项


+ 第一项

+ 第二项

+ 第三项


- 第一项

- 第二项

- 第三项

有序列表使用数字并加上 . 号来表示,如:

1. 第一项

2. 第二项

3. 第三项

列表嵌套只需在子列表中的选项添加四个空格即可:

1. 第一项:

- 第一项嵌套的第一个元素

- 第一项嵌套的第二个元素

2. 第二项:

- 第二项嵌套的第一个元素

- 第二项嵌套的第一个元素


Markdown 区块引用是在段落开头使用 > 符号 ,然后后面紧跟一个空格符号:

> 区块引用

> 菜鸟教程

> 学的不仅是技术更是梦想

显示结果如下:


另外区块是可以嵌套的,一个 > 符号是最外层,两个 > 符号是第一层嵌套,以此类推退:

> 最外层

> > 第一层嵌套

> > > 第二层嵌套

显示结果如下:


区块中使用列表

区块中使用列表实例如下:

> 区块中使用列表

> 1. 第一项

> 2. 第二项

> + 第一项

> + 第二项

> + 第三项

显示结果如下:


列表中使用区块

如果要在列表项目内放进区块,那么就需要在 > 前添加四个空格的缩进。

区块中使用列表实例如下:

* 第一项

> 菜鸟教程

> 学的不仅是技术更是梦想

* 第二项

显示结果如下:



如果是段落上的一个函数或片段的代码可以用反引号把它包起来(`),例如:

`printf()` 函数

显示结果如下:


代码区块

代码区块使用 4 个空格或者一个制表符(Tab 键)

实例如下:


显示结果如下:


你也可以用 ``` 包裹一段代码,并指定一种语言(也可以不指定):

```javascript

$(document).ready(function () {

alert('RUNOOB');

});

```

显示结果如下:



链接使用方法如下:

[链接名称](链接地址)


或者


<链接地址>

例如:

这是一个链接 [菜鸟教程](https://www.runoob.com)

显示结果如下:


直接使用链接地址:

<https://www.runoob.com>

显示结果如下:


高级链接

链接也可以用变量来代替,文档末尾附带变量地址:

这个链接用 1 作为网址变量 [Google][1]

这个链接用 runoob 作为网址变量 [Runoob][runoob]

然后在文档的结尾为变量赋值(网址)


[1]: http://www.google.com/

[runoob]: http://www.runoob.com/

显示结果如下:



Markdown 图片语法格式如下:

![alt 属性文本](图片地址)


![alt 属性文本](图片地址 "可选标题")

开头一个感叹号 !

接着一个方括号,里面放上图片的替代文字

接着一个普通括号,里面放上图片的网址,最后还可以用引号包住并加上选择性的 'title' 属性的文字。

使用实例:

![RUNOOB 图标](http://static.runoob.com/images/runoob-logo.png)


![RUNOOB 图标](http://static.runoob.com/images/runoob-logo.png "RUNOOB")

显示结果如下:


当然,你也可以像网址那样对图片网址使用变量:

这个链接用 1 作为网址变量 [RUNOOB][1].

然后在文档的结尾位变量赋值(网址)


[1]: http://static.runoob.com/images/runoob-logo.png

显示结果如下:


Markdown 还没有办法指定图片的高度与宽度,如果你需要的话,你可以使用普通的 <img> 标签。

<img src="http://static.runoob.com/images/runoob-logo.png" width="50%">

显示结果如下:



Markdown 制作表格使用 | 来分隔不同的单元格,使用 - 来分隔表头和其他行。

语法格式如下:

| 表头 | 表头 |

| ---- | ---- |

| 单元格 | 单元格 |

| 单元格 | 单元格 |

以上代码显示结果如下:


对齐方式

我们可以设置表格的对齐方式:

-: 设置内容和标题栏居右对齐。

:- 设置内容和标题栏居左对齐。

:-: 设置内容和标题栏居中对齐。

实例如下:

| 左对齐 | 右对齐 | 居中对齐 |

| :-----| ----: | :----: |

| 单元格 | 单元格 | 单元格 |

| 单元格 | 单元格 | 单元格 |

以上代码显示结果如下:



Markdown 高级技巧

支持的 HTML 元素

不在 Markdown 涵盖范围之内的标签,都可以直接在文档里面用 HTML 撰写。

目前支持的 HTML 元素有:<kbd> <b> <i> <em> <sup> <sub> <br>等 ,如:

使用 <kbd>Ctrl</kbd>+<kbd>Alt</kbd>+<kbd>Del</kbd> 重启电脑

输出结果为:

则表达式是一个十分强大的工具,可以完成对字符串的模式匹配以及提取工作,在很多工程中都被广泛使用,但是我之前对于Python正则表达式模块re的使用都没有进行一些深入学习,对原始字符串之类的了解也比较浅显,之前有个同学问到我关于反斜线\在正则中的一些表现的时候我也迷惑了,跟周围人讨论后上StackOverflow问了一番,对这方面又多了一些了解,今天跟大家分享。

字符串中的反斜线\

我们知道,反斜线\在字符串以及正则表达式中都是完成转义的工作,比如我有一个字符串s1:

现在这个字符串s1内容为123,如果我想在字符串中保留一个单引号',那么我可能的一种做法是使用双引号来包含内容,字符串s2:

Python中的单引号'和双引号'其实都可以用来指示字符串,我们在此处使用双引号而不是单引号,原因是因为如果使用单引号Python解释器将会无法对这条语句进行正常解释,因为紧跟2之后的'被用来指示字符串结束,然而后面还剩下3这个字符,所以会引发Syntax Error:

但是,只是使用语句中不包含的那种引号来指示字符串有时候是行不通的,因为有时候一个字符串可能同时包含单引号和双引号,比如字符串1"2'3,所以这时候我们需要使用反斜线\来对内容进行转义,因此对于字符串1"2'3,我们可以采用如下表示:

注意我们并没有对字符串内容中的双引号"进行转义,原因同上,字符串使用单引号指示的,因此双引号只会被认为是一个普通的字符。对于字符串内部的单引号',为了让解释器得知它是一个普通字符,我们在其前面增加了一个反斜线\\'组合起来的意思是对反斜线后面的字符'进行转义,可以这样理解,通过添加一个反斜线\,对于\',你告诉了解释器:不要按照普通的方式去解释这个字符',这样解释器就能正确地完成对该字符串的解释。

有编程基础的读者应该会知道转义这一概念广泛存在于很多编程语言中,对\n\r等字符应该有一定了解,类比前面的解释,\n表示:不要按照普通的方式去解释这个字符n

进一步理解,假设我们从键盘输入了字符串:abc\nde,一共输入了7个字符,这7个字符经过Python解释器解释,两个字符\n将会被转义成一个字符\n,请特别注意这一点,虽然从表面上看是两个字符,但其实\n是一个特殊的字符,这一点我们可以从以下代码看出:

有了这些基础,下面我们进入到正则的部分。

正则表达式中的反斜线\

因为有了Python解释器首先对字符串的转义,所以正则表达式模块re看到的和你输入的可能有所不同,比如,\n在字符串层被转义成一个换行字符,然后re看到的是字符\n而不是\n两个字符,看以下代码:

以上代码首先定义了一个前文提到的字符串s,然后使用re模块的search方法搜索,然后要搜索的字符串是\n,注意我们输入的是字符\和字符n,然后经过Python解释器的解释实际在内存中的是一个\n字符,因此re模块看到的是只有一个字符的字符串\n,而不是两个字符,最后完成搜索。

如果我们想匹配字符串\\n,应该怎么输入模式呢?,一种方法是:

对于字符串\\n,它的内容其实是一个普通的\字符和一个换行字符\n,对于我们输入的匹配模式\\n,首先经过Python解释器的字符串解释,变成了两个普通的\字符和一个换行字符\n,然后这些内容通过re模块的compile方法,compile方法发现有两个连续的\符号,因此将在接下来的匹配中匹配一个普通的\字符(请注意理解这一点),而\n字符将会匹配一个\n字符,因此该模式的匹配内容是字符串中的一个普通\字符和一个\n字符。当然,写这么多反斜线显得十分麻烦,所以Python也提供了一种方便的方式,即原始字符串,其格式为在字符串前添加一个r字符:r'content',通过这样的书写方式,Python解释器将使用不同的规则来解释转义(原始字符串不能以\符号结尾)。因此上述模式可以简化为:

让我们再回到普通字符串,考虑以下代码:

对于模式\\\n,经过Python解释器的解释将变成一个普通’`字符和一个换行字符\nre模块的compile方法将会看到以上解释结果,然后该模式组合起来就是:匹配一个换行字符\n的转义字符,也就是对换行字符\n进行转义!结果是:

相关连接:

  • https://docs.python.org/3.6/library/re.html

  • http://stackoverflow.com/questions/33582162/backslashes-in-python-regular-expressions

本文原文地址: http://youchen.me/2017/04/24/Backslashes-in-Python-Regular-Expressions/

信所有已经步入Web前端开发领域的同学们,对于HTML超文本标记语言都不会感觉陌生。即便是正准备开始系统学习Web前端开发的同学,也多多少少了解这门语言。HTML语言由W3C互联网联盟制定其使用规范并对外发布。严格来说,HTML并不属于编程语言,更多的是一种带有“标记”性质的代码集合。HTML语言所书写的HTML文档也都是由标记或标记对组成的。这种语言没有逻辑流程,也就是说只要书写正确,浏览器就可以直接将最终的效果呈现在页面中。

W3C 互联网联盟

这里,小海老师想带领大家重温HTML语言,对前端开发中常用的HTML标记或标记对进行总结,对于标记或标记对中用到的属性进行阐述。对于已经在前端开发领域摸爬滚动数年的老手们,这些内容一定是已经烂熟于心了,因此这篇文章更适合哪些刚刚接触这个行业的新人们。

首先我要说明,本文章只收录了HTML 4版本中包括的常用标记对和属性,对于HTML 5新增的标记对和属性,小海老师会在后续的文章中专门进行讲解。

1、HTML文档的基本结构:

HTML(Hyper Text Markup Language,超文本标记语言)在书写时应该满足它最基本的结构。HTML文档就好像人体的结构似的,被分为“文件头”和“文件体”两部分。文件头利用<head></head>标记对来实现,文件体利用<body></body>标记对来实现。

HTML语言的基本结构

2、HTML对标记和标记对的规定:

HTML语言中大部分的标记都是成对出现的,被人们称为“标记对”,书写时利用尖括号(也就是小于号和大于号)来进行包裹。格式为:

<标记对></标记对>

为了和早期的HTML版本兼容,W3C(World Wide Web Consortium,互联网联盟)在制定HTML标准的同时还保留了一小部分不成对的标记。因为不成对,所以被人们称为“标记”,书写时在标记的结束位置应该添加一个反斜杠。格式为:

<标记 />

3、HTML对属性的规定:

属性是为了拓展标记的功能书写在起始标记中的,属性分为“属性名”和“属性值”两部分。属性之间利用空格隔开,属性值应该用双引号引住,属性名和属性值之间利用等号连接。带有属性的标记对格式为:

<标记 属性名1=“属性值1” 属性名2=“属性值2”> </标记>

说到这里,我们应该继续介绍HTML中包括的常用标记对与其对应的属性。这里,首先我们将HTML标记对划分为以下几类:

  • HTML结构标记

  • 文本段落标记

  • 列表标记

  • 超级链接标记

  • 图像标记

  • 表格标记

  • 表单标记

  • 块标记

一、HTML结构标记

支撑起HTML文档结构的标记对包括以下几个:

  • <html></html>:所有的HTML代码必须书写在该标记对内部。

  • <head></head>:文件头标记对。

  • <body></body>:文件体标记对。

  • <title></title>:文档标题标记对。

  • <meta />:元信息标记。

  • <link />:用于加载外部CSS文件的标记。

  • <style></style>:用于书写内部CSS代码的标记对。

  • <script></script>:用于书写或加载脚本代码的标记对。

HTML 结构标记

下面罗列了一些常用的结构用法:

1、加载字符集:<meta charset=“utf-8”/>

2、加载地址栏图标:<link rel=“shortcut icon” href=“ico_URL” />

3、加载外部CSS文件:<link rel=“stylesheet” type=“text/css” href=“*.css” />

4、加载js文件:<script type=“text/javascript” src=“*.js”></script>

二、文本段落标记

用于在页面中输入文本和段落的标记对包括以下几个:

  • <h1></h1>:标题标记对。共有六个,<h1>到<h6>。

  • <p></p>:段落标记对。

  • <font></font>:字体标记对。

  • <pre></pre>:预格式化文本标记对。

  • <center></center>:居中标记对。

  • <xmp></xmp>:忽略HTML标签标记对。

  • <!--注释内容-->:注释标记。

文本段落标记

除了上述标记对之外,HTML还提供了一部分代码用于在页面中输入特殊字符。这里我列举了一部分常用的特殊字符,可以从下图中看到。

特殊符号的表示

同时,HTML还提供了一组有关文本修饰的标记对,可以从下图中看到。

文本修饰标记对

三、列表标记

用于在页面中显示列表的标记对包括以下几个:

  • <ul></ul>:用于实现无序列表的标记对。

  • <ol></ol>:用于实现有序列表的标记对。

  • <li></li>:用于实现无序列表和有序列表列表项的标记对。

  • <dl></dl>:用于实现定义列表的标记对。

  • <dt></dt>:用于在定义列表列表项中实现定义名词的标记对。

  • <dd></dd>:用于在定义列表列表项中对定义名词进行解释的标记对。

列表标记对

四、超级链接

用于在页面中实现超级链接的标记对只有一个:

  • <a></a>:实现超级链接的标记对。

超级链接标记对有以下常用的属性:

  • href:用于指定超级链接的目标地址。

  • title:用于指定当鼠标经过超级链接时给出的提示语。

  • target:用于指定打开链接地址页面的方式。

  • name:用于指定锚的名称。

超级链接标记对的属性

五、图像

用于在页面中实现图像的标记只有一个:

  • <img />:实现图像的标记。

图像标记有以下常用的属性:

  • src:用于指定图片所在的路径和文件名。

  • width:用于指定图片的宽度,单位为像素。

  • height:用于指定图片的高度,单位为像素。

  • border:用于指定图片的边框粗细,单位为像素。

  • alt:用于指定图片的替代文本。

  • align:用于指定图片相对于周围元素的对齐方式。

  • vspace:用于指定图片与环绕在其一侧的周围元素之间的垂直距离。

  • hspace:用于指定图片与环绕在其一侧的周围元素之间的水平距离。

图像标记

结束语

由于篇幅问题,以上只是HTML常用标记对和属性的第一部分,接下来我还会继续发布第二部分,供广大前端爱好者学习与参考。

由于考虑到大部分人对HTML语言的基本使用还是比较熟练的,所以本文仅仅是单纯的列出了标记对的名称和属性名称,并没有详细的讲解这些标记对和属性的使用方法。如果您大部分内容都是已经掌握了的,甚至是已经达到熟练使用的程度,可以略读本文甚至忽略本文。如果您刚刚涉足HTML语言,对本文这种带有列举性质的具体使用方法并不清除,可以私信我,我可以为您免费发一份我自己编写的关于HTML语言较为详尽的PDF教材。欢迎广大学习者索取。


【未完待续】