markdown常用语法与emmet常用语法

1.markdown常用语法

1.标题(标题建议最多用三级，不宜过深):

1.1 用法：

#  一级标题
##  二级标题
### 三级标题
#### 四级标题
........

1.2 效果：

一级标题

二级标题

三级标题

四级标题

2.列表

2.1 无序列表用法(父列表需要- 格式，子列表格式与父列表相同，只需要添加2个空格)：

- 无序列表
- 无序列表
- 无序列表
  - 无序列表的子列表
  - 无序列表的子列表

2.2 有序列表用法(父列表需要1. 格式，子列表格式与父列表相同，只需要添加2个空格)：

1. 有序列表
2. 有序列表
3. 有序列表
  3.1 有序列表的子列表
  3.2 有序列表的子列表

2.1.1:无序列表效果

• 无序列表
• 无序列表
• 无序列表
  • 无序列表的子列表
  • 无序列表的子列表

2.2.1:有序列表效果

1. 有序列表
2. 有序列表
3. 有序列表
   3.1 有序列表的子列表
   3.2 有序列表的子列表

3.代码

3.1 单行代码用法：

`单行代码`

3.2 多行代码用法：

、 ```多行代码```   、

3.1.1 单行代码效果：

单行代码

3.2.1 多行代码效果:

多行代码 <h2>Hello World</h2>

4.表格

4.1 表格用法：

|周一|周二|周三
|---|---|---
|摸鱼|摸鱼|摸鱼
|摸鱼|摸鱼|摸鱼

4.2 表格效果：

周一	周二	周三
摸鱼	摸鱼	摸鱼
摸鱼	摸鱼	摸鱼

5.图片

5.1 图片用法：

![图片加载失败时显示的字](图片地址)

5.2图片效果：

2.emment常用语法：

1.html:5 或者 ! 效果：快速创建html文档结构

2. #box 或者div#box效果：创建一个div,id为box

实现： <div id="box"></div>

2.1div#box{box} 效果：创建一个div,id为box，div里的内容为box

实现：<div id="box">box</div>

3..box或者div.box 效果：创建一个div,class为box

实现:<div class="box"></div>

4.快速生成父子层级 ul>li>a{首页} 效果：创建一个ul列表,内容为a标签的首页

实现:

<ul>
  <li><a href="">首页</a></li>
</ul>

5.快速生成兄弟层级 .title{首页}+.head{主题} 效果:创建2个div，内容分别为首页和主题

实现：

<div class="title">首页</div>
<div class="head">主题</div>

6.快速生成重复内容 ul>li*3>a{首页} 效果：生成三个li列表项

实现：

<ul>
    <li><a href="">首页</a></li>
    <li><a href="">首页</a></li>
    <li><a href="">首页</a></li>
</ul>

7.快速生成升序列表 ul>li*4>a{首页$} 效果：生成首页1-首页4

实现：

<ul>
    <li><a href="">首页1</a></li>
    <li><a href="">首页2</a></li>
    <li><a href="">首页3</a></li>
    <li><a href="">首页4</a></li>
</ul>

8.从指定序号开始升序 ul>li*4>a{首页$@4} 效果：生成首页4-首页7

实现：

<ul>
    <li><a href="">首页4</a></li>
    <li><a href="">首页5</a></li>
    <li><a href="">首页6</a></li>
    <li><a href="">首页7</a></li>
</ul>

9.指定降序的值进行降序 ul>li*4>a{首页$@-5} 效果：生成首页8-首页5

实现：

<ul>
    <li><a href="">首页8</a></li>
    <li><a href="">首页7</a></li>
    <li><a href="">首页6</a></li>
    <li><a href="">首页5</a></li>
</ul>

10.五行八列的表格:table>caption{文章标题}+(thead>tr>th{标题}*8)+(tbody>tr*4>td{内容}*8)

实现：