小白详细基础入门以及进阶教程
一、斜体、粗体
Markdown语法
**双是粗体**
__星号和下划线效果一样__
*单个是斜体*
_单个是斜体_
**可以 加空格**
效果如下:
双是粗体
星号和下划线效果一样
单个是斜体
单个是斜体
可以 加空格
二、分割线
三个或者以上的-_*,必须单独一行,可含有空格。
Markdown语法
---
___
***
效果如下
三、区块引用
使用’>’角括号进行区块引用
Markdown语法
>区块引用
>>多层引用
效果如下
区块引用
多层引用
四、标题样式
markdown支持两种标题语法,Setext和atx,Setext 形式是用底线的形式,利用三个或更多 = (最高阶标题)和 - (第二阶标题),Atx 形式在行首插入 1 到 6 个 # ,对应到标题 1 到 6 阶。
Markdown语法
Setext最高阶标题
===
Setext第二阶标题
---
#Atx一级标题
##Atx二级标题
###Atx三级标题
####Atx四级标题
####Atx五级标题
#####Atx六级标题
效果如下
五、无序列表
使用-+*号,效果一样,注意符号后面的空格,但是不能混合使用,混合的话就成了嵌套列表
Markdown语法
- 减号无序列表
- 减号无序列表
+ 加号无语列表
+ 加号无序列表
* 星号无序列表
* 星号无序列表
- - 混合使用
+ + 混合使用
+ * 混合使用
* - 混合使用
效果如下
- 减号无序列表
- 减号无序列表
- 加号无语列表
- 加号无序列表
- 星号无序列表
- 星号无序列表
-
- 混合使用
-
- 混合使用
-
- 混合使用
-
- 混合使用
六、有序列表
使用数字和英文句点,数字可以无序,注意点后面的空格
Markdown语法
1. 有序列表1
2. 有序列表2
5. 有序列表5
8. 有序列表8
6. 有序列表6
效果如下
- 有序列表1
- 有序列表2
- 有序列表5
- 有序列表8
- 有序列表6
七、嵌套列表
注意第二级的前后都有空格
Markdown语法
- 嵌套列表1
- 嵌套列表2
- 嵌套列表3
- 嵌套列表4
- 嵌套列表5
效果如下
- 嵌套列表1
- 嵌套列表2
- 嵌套列表3
- 嵌套列表4
- 嵌套列表5
八、链接
链接有两种,行内(inline) 和 参考(reference)两种形式
1、行内(inline)形式
行内形式是直接在后面用括号直接接上链接
Markdown语法
[百度](www.baidu.com)
效果如下
2、加上title属性
也可以加上title属性,注意中间有个空格,使用双引号,把鼠标放在链接上,就可以看出区别了
Markdown语法
[百度](www.baidu.com "with a title")
效果如下
3、参考(reference)方式:
Markdown语法
这是[Google][1] ,这是[Yahoo][2],这是[MSN][3].
[1]: http://google.com/ "Google"
[2]: http://search.yahoo.com/ "Yahoo Search"
[3]: http://search.msn.com/ "MSN Search"
效果如下
3、自动链接:自动链接直接用一对尖括号包围即可
Markdown语法
<https://www.baidu.com>
九、插入图片:
图片的语法和文字链接的形式很像,只不过前面加个!,后面跟图片的地址
1、行内(inline)形式
(注意title属性是可选的)
Markdown语法
![kobe](http://pic11.photophoto.cn/20090626/0036036341009653_b.jpg "Kobe Bryant")
效果如下
2、参考(reference)形式
效果和上面一样
Markdown语法
![kobe][id]
[id]:http://pic11.photophoto.cn/20090626/0036036341009653_b.jpg "Kobe Bryant"
十、代码
1、代码段
代码段在一般的段落文字中,你可以使用反引号 ` 来标记代码区段,区段内的 &、< 和 > 都会被自动的转换成 HTML 实体,这项特性让你可以很容易的在代码区段内插入 HTML 码:
Markdown语法
I strongly recommend against using any `<blink>` tags.
I wish SmartyPants used named entities like `—`
instead of decimal-encoded entites like `—`
效果如下
I strongly recommend against using any <blink>
tags.
I wish SmartyPants used named entities like —
instead of decimal-encoded entites like —
.
2、段落代码块
如果要建立一个已经格式化好的代码区块,只要每行都
缩进 4 个空格或是一个 tab |
效果如下
我是代码块
我是代码块
我是代码块
3、行内代码:高亮
在第一行的后面指定编程语言,也可以不指定。(Markdown目前好像不支持更改代码块背景颜色。。。。)
Markdown语法
``` python
@requires_authorization
def somefunc(param1='', param2=0):
'''A docstring'''
if param1 > param2: # interesting
print 'Greater'
return (param2 - param1 + 1) or None
class SomeClass:
pass
>>> message = '''interpreter
... prompt'''
```
效果如下
@requires_authorization
def somefunc(param1='', param2=0):
'''A docstring'''
if param1 > param2: # interesting
print 'Greater'
return (param2 - param1 + 1) or None
class SomeClass:
pass
>>> message = '''interpreter
... prompt'''
十一、注释和html的一样
<!-- 注释 -->
十二、转义字符
Markdown语法
\\ 反斜杠
\` 反引号
\* 星号
\_ 下划线
\{\} 大括号
\[\] 中括号
\(\) 小括号
\# 井号
\+ 加号
\- 减号
\. 英文句号
\! 感叹号
效果如下
\ 反斜杠
` 反引号
* 星号
_ 下划线
{} 大括号
[] 中括号
() 小括号
# 井号
+ 加号
- 减号
. 英文句号
! 感叹号
十三、表格
Markdown语法
| name | age | sex |
| ------------- | ------------- | ------|
| kobe | 8 | man |
| bryant | 24 | man |
效果如下
name | age | sex |
---|---|---|
kobe | 8 | man |
bryant | 24 | man |
Markdown语法
name | age
--- | ---
kobe | 8
bryant | 24
效果如下
name | age |
---|---|
kobe | 8 |
bryant | 24 |
进阶教程: |
1、更改字体、字号、颜色
Markdown 通过简单标记语法,使普通文本内容具有一定格式。但它本身不支持修改字体、字号与颜色等功能的。CSDN-markdown 编辑器是其衍生版本,支持基于 PageDown ( Stack Overflow)所使用的编辑器的扩展功能(如表格、脚注、内嵌HTML、内嵌 LaTeX 等等)。
Size:规定文本的尺寸大小,取值从 1 到 7 ,浏览器默认值是 3.
Markdown语法
<font face="黑体">我是黑体字</font>
<font face="微软雅黑">我是微软雅黑</font>
<font face="STCAIYUN">我是华文彩云</font>
<font color=red>我是红色</font>
<font color=#008000>我是绿色</font>
<font color=Blue>我是蓝色</font>
<font size=5>我是尺寸</font>
<font face="黑体" color=green size=5>我是黑体,绿色,尺寸为5</font>
效果如下
我是黑体字
我是微软雅黑
我是华文彩云
我是红色
我是绿色
我是蓝色
我是尺寸
我是黑体,绿色,尺寸为5
2、为文字添加背景色
由于 style 标签和标签的 style 属性不被支持,所以这里只能是借助 table, tr, td 等表格标签的 bgcolor 属性来实现背景色。故这里对于文字背景色的设置,只是将那一整行看作一个表格,更改了那个格子的背景色(bgcolor)
Markdown语法
<table><tr><td bgcolor=yellow>背景色yellow</td></tr></table>
效果如下
背景色yellow |
3、设置图片大小
Markdown语法:更改图片百分比
<img src="http://pic11.photophoto.cn/20090626/0036036341009653_b.jpg" width="50%" height="50%">
效果如下
Markdown语法:更改图片像素值
<img src="http://pic11.photophoto.cn/20090626/0036036341009653_b.jpg" width="251" height="350" >
效果如下
Markdown语法:图片居中
<div align=center><img src="http://pic11.photophoto.cn/20090626/0036036341009653_b.jpg" width="50%" height="50%"></div>
效果如下
ps:right、left
基础知识:
[TOC] #生成目录
 或者 #空格