博客列表 >Markdown语法与Emmet语法

Markdown语法与Emmet语法

P粉036614676
P粉036614676原创
2022年07月02日 12:42:01466浏览

Markdown语法

1.标题

  1. # 一级标题
  2. ## 二级标题
  3. ### 三级标题
  4. #### 四级标题
  5. ##### 五级标题
  6. ###### 六级标题

演示效果如下:
图片

2.列表

2.1无序列表

  1. - list1
  2. - list2
  3. - list3
  4. - ltem1
  5. - item2

效果图如下:

  • list1
  • list2
  • list3
    • ltem1
    • item2

2.2有序列表

  1. 1. list1
  2. 2. list2
  3. 2.1 list

效果图如下:

  1. list1
  2. list2
    2.1 list

3.代码

  1. ```php
  2. $x = 1234
  3. echo $x;
  4. ``
  5. `

效果如下:

  1. $x = 1234
  2. echo $x;

4.表格

  1. |id|name|email|salary|
  2. |---:|---:|---|---|
  3. |1|杨过|yk.com|无|
  4. |2|yk|信息.com|无|
  5. :在哪边就向哪边对齐,两边都有就中间对齐
  6. |-:|右边对齐
  7. |:-|左边对齐
  8. |:-:|居中对齐

效果图如下:

id name email salary
1 杨过 yk.com
2 yk 信息.com

5.图片与链接

5.1图片

  1. ![名字](链接)

效果图如下:
PHP中文网

5.2链接

  1. [名字](链接)

效果图如下:

PHP中文网

Emmet语法

1.对单个元素

1.1快速生成一个标签

标签名+tab:
效果图如下:

  1. h1再按回车:
  2. <h1></h1>

1.2生成标签的id属性

*标签名+tab+#

  1. h1#再·按回车
  2. <h1 id=""></h1>

1.3生成标签的classs属性‘

标签名+tab+.

  1. h1.再按回车:
  2. <h1 class=""></h1>
  3. h1.x再按tab键就是如下:
  4. <ha class="x"></ha>

1.4生成标签的其他属性

标签名+[属性】

  1. img[alt],再按回车:
  2. <img src="" alt="">

1.5生成多个单个元素

  1. h1*3再按tab键
  2. <a href=""></a><a href=""></a><a href=""></a>

1.6生成标签的值

  1. li{xx}再按tab键:
  2. <li>x</li>

2.对多个元素

2.1生成多个兄弟

  1. a+h1+h2再按tab键
  2. <a href=""></a>
  3. <h1></h1>
  4. <h2></h2>

2.2生成父子元素

每个元素用大于号括起来,就是哪个的子元素

  1. ul>li>a再按tab键
  2. <ul>
  3. <li><a href=""></a></li>
  4. </ul>

2.3序号’@’和‘#’

  1. ul>li.ix{as$@1}*3再按tab键:
  2. <ul>
  3. <li class="ix">as1</li>
  4. <li class="ix">as2</li>
  5. <li class="ix">as3</li>
  6. </ul>

3.练习(生成一个5*8的表格)

  1. table>caption{标题}+(thead>th>br>tr{表格头部}*5)+tbody>th>br*7>tr{单元格}*5
  2. 再按tab键,这个答案仅供参考
声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议