博客列表 >如何使用 Markdown and Emmet

如何使用 Markdown and Emmet

杰西卡妈妈
杰西卡妈妈原创
2021年03月29日 02:22:32549浏览

markdown edit

1). Title
前面加1个#是最大,加2个#更小,依次加#更小

title No.1

title No.2

title No.3

title No.4

2). word
加粗
斜体
斜体加粗
~~ 删除线 ~~

3) 引用
在引用的文字前加>即可。引用也可以嵌套,如加两个>>三个>>>
n个…same meaning

quote

quote

quote

4)分割线
三个或者三个以上的 - 或者 * 都可以
———split
5)Picture
图片alt

图片alt就是显示在图片下面的文字,相当于对图片内容的解释。
图片title是图片的标题,当鼠标移到图片上时显示的内容。title可加可不加
6)超链接
超链接名
title可加可不加
注:Markdown本身语法不支持链接在新页面中打开,貌似简书做了处理,是可以的。别的平台可能就不行了,如果想要在新页面中打开的话可以用html语言的a标签代替。
7)列表
无序列表用 - + 任何一种都可以,注意:- + 跟内容之间都要有一个空格

  • list
  • list
  • list
    有序列表: 数字加点
  1. list
  2. list

列表嵌套
上一级和下一级之间敲三个空格即可
一级无序列表内容
一级无序列表内容
一级无序列表内容
8)表格
表头|表头|表头|
—-|:—:|—-:|
内容|内容|内容
内容|内容|内容

第二行分割表头和内容。

  • 有一个就行,为了对齐,多加了几个
    文字默认居左
    -两边加:表示文字居中
    -右边加:表示文字居右
    注:原生的语法两边都要用 | 包起来
    9)代码
    单行代码:代码之间分别用一个反引号包起来
    代码内容
    代码块:代码之间分别用三个反引号包起来,且两边的反引号单独占一行
    1. 代码...
    2. 代码...
    3. 代码...
    10) 流程图
    Created with Raphaël 2.1.2StartMy OperationYes or No?Endyes

Emmet

1)输入完生成HTML的缩写语句后,按下Tab,即可生成对应的HTML代码
2) 相关语法
后代Child: >
缩写:div>ul>li
兄弟Sibling: +
缩写:div+p+bq
Climb-up上级元素: ^
缩写:div+div>p>span+em^bq
缩写:div+div>p>span+em^^bq
分组:()
Grouping: ( )
缩写:div>(header>ul>li2>a)+footer>p
缩写:(div>dl>(dt+dd)
3)+footer>p
重复多份:
Multiplication:

缩写:ul>li5
编号:$
Item numbering: $
缩写:ul>li.item$
5
缩写:h$[title=item$]{Header $}3
缩写:ul>li.item$$$
5
缩写:ul>li.item$@-5
缩写:ul>li.item$@3
5

ID和类属性
缩写: #header
缩写: .title
缩写: form#search.wide
缩写: p.class1.class2.class3

自定义属性 Custom attributes
缩写:p[title=”Hello world”]
缩写:td[rowspan=2 colspan=3 title]
缩写:[a=’value1’ b=”value2”]

文本:{ }
缩写:a{Click me}
缩写:p>{Click }+a{here}+{ to continue}
Implicit tag names 隐式标签
缩写:.class
缩写:ul>.class
缩写:table>.row>.col

3).HTML
缩写:!

end

声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议