diff --git a/README.md b/README.md index 93055a7..f238270 100644 --- a/README.md +++ b/README.md @@ -27,6 +27,7 @@ Quick Reference ## 工具包 +[Emmet](./docs/emmet.md) [npm](./docs/npm.md) [package.json](./docs/package.json.md) [Semver](./docs/semver.md) diff --git a/docs/emmet.md b/docs/emmet.md new file mode 100644 index 0000000..0213074 --- /dev/null +++ b/docs/emmet.md @@ -0,0 +1,2404 @@ +Emmet +==== + +[Emmet](https://emmet.io/) 是一个用于提升 HTML 和 CSS 代码编写的 Web 开发人员工具包，它允许您使用著名的 CSS 选择器以光速编写大型 HTML 代码块。 + + +Emmet 语法 +--------------- + +### 入门 + +让我们开始将您的开发提高到光速。 + +- [Visual Studio 代码中的 Emmet](https://code.visualstudio.com/docs/editor/emmet) _(code.visualstudio.com)_ +- [Sublime Text 的 Emmet 2](https://github.com/emmetio/sublime-text-plugin) _(github.com)_ +- [Emmet for Coda](https://emmet.io/download/coda/) _(emmet.io)_ +- [Emmet for Atom](https://github.com/emmetio/emmet-atom#readme) _(github.com)_ + + +### 乘法：* + +`ul>li*5` + +```html + +``` + +### 孩子: > + +`nav>ul>li` + +```html + +``` + +### 自定义属性 + + +`p[title="Hello world"]` + +```html +

+``` + +`td[rowspan=2 colspan=3 title]` + +```html + +``` + +`[a='value1' b="value2"]` + +```html +
+``` + +### 文本: {} + +a{Click me} + +```html +Click me +``` + +p>{Click }+a{here}+{ 继续} + +```html {.wrap} +

Click here 继续

+``` + +### ID 和 CLASS 属性 + + +#header + +```html + +``` + +.title + +```html +
+``` + +form#search.wide + +```html + +``` + +p.class1.class2.class3 + +```html +

+``` + +### 隐式标签名称 + + +.class + +```html +
+``` + +em>.class + +```html + +``` + +ul>.class + +```html + +``` + +table>.row>.col + +```html + + + + +
+``` + +### 兄弟: + + +div+p+bq + +```html +
+

+
+``` + +### $ + + +ul>li.item$*3 + +```html + +``` + +h$[title=item$]{Header $}*3 + +```html +

Header 1

+

Header 2

+

Header 3

+``` + +ul>li.item$$$*3 + +```html + +``` + +ul>li.item$@-*3 + +```html + +``` + +ul>li.item$@2*3 + +```html + +``` + + +### 上一层: ^ + +div+div>p>span+em^bq + +```html +
+
+

+
+
+``` + +div+div>p>span+em^^bq + +```html +
+
+

+
+
+``` + +### 分组: () + +div>(header>ul>li*2>a)+footer>p + +```html +
+
+ +
+ +
+``` + +(div>dl>(dt+dd)*4)+footer>p + +```html +
+
+
+
+
+
+
+
+
+
+
+
+ +``` + +HTML +--- + +### HTML 1 + +`!` 或者 `html:5` + +```html + + + + + Document + + + + + +``` + +a + +```html + +``` + +a:link + +```html + +``` + +a:mail + +```html + +``` + +abbr + +```html + +``` + +acronym, acr + +```html + +``` + +base + +```html + +``` + +basefont + +```html + +``` + +br + +```html +
+``` + +frame + +```html + +``` + +hr + +```html +
+``` + +bdo + +```html + +``` + +bdo:r + +```html + +``` + +bdo:l + +```html + +``` + +col + +```html + +``` + +link + +```html + +``` + +link:css + +```html + +``` + +link:print + +```html + +``` + +link:favicon + +```html + +``` + +link:touch + +```html + +``` + +link:rss + +```html + +``` + + +link:atom + +```html + +``` + + +link:import, link:im + +```html + +``` + +meta + +```html + +``` + +meta:utf + +```html + +``` + +meta:win + +```html + +``` + + +meta:vp + +```html + +``` + + +meta:compat + +```html + +``` + +style + +```html + +``` + +script + +```html + +``` + +script:src + +```html + +``` + +img + +```html + +``` + +img:srcset, img:s + +```html + +``` + +img:sizes, img:z + +```html + +``` + +picture + +```html + +``` + +source, src + +```html + +``` + +source:src, src:sc + +```html + +``` + +source:srcset, src:s + +```html + +``` + +source:media, src:m + +```html + +``` + +source:type, src:t + +```html + +``` + +source:sizes, src:z + +```html + +``` + +source:media:type, src:mt + +```html + +``` + + +source:media:sizes, src:mz + +```html + +``` + +source:sizes:type, src:zt + +```html + +``` + +iframe + +```html + +``` + +embed + +```html + +``` + +object + +```html + +``` + +param + +```html + +``` + +map + +```html + +``` + +area + +```html + +``` + +area:d + +```html + +``` + +area:c + +```html + +``` + +area:r + +```html + +``` + +area:p + +```html + +``` + +form + +```html +
+``` + +form:get + +```html +
+``` + +form:post + +```html +
+``` + +label + +```html + +``` + +input + +```html + +``` + +inp + +```html + +``` + +input:hidden, input:h 别名 input[type=hidden name] + +```html + +``` + +input:text, input:t 别名 inp + +```html + +``` + +input:search 别名 inp[type=search] + +```html + +``` + +input:email 别名 inp[type=email] + +```html + +``` + +### HTML 2 + +input:url 别名 inp[type=url] + +```html + +``` + +input:password, input:p 别名 inp[type=password] + +```html + +``` + +input:datetime 别名 inp[type=datetime] + +```html + +``` + +input:date 别名 inp[type=date] + +```html + +``` + +input:datetime-local 别名 inp[type=datetime-local] + +```html + +``` + +input:month 别名 inp[type=month] + +```html + +``` + +input:week 别名 inp[type=week] + +```html + +``` + +input:time 别名 inp[type=time] + +```html + +``` + +input:tel 别名 inp[type=tel] + +```html + +``` + +input:number 别名 inp[type=number] + +```html + +``` + +input:color 别名 inp[type=color] + +```html + +``` + +input:checkbox, input:c 别名 inp[type=checkbox] + +```html + +``` + +input:radio, input:r 别名 inp[type=radio] + +```html + +``` + +input:range 别名 inp[type=range] + +```html + +``` + +input:file, input:f 别名 inp[type=file] + +```html + +``` + +input:submit, input:s + +```html + +``` + +input:image, input:i + +```html + +``` + +input:button, input:b + +```html + +``` + +isindex + +```html + +``` + +input:reset 别名 input:button[type=reset] + +```html + +``` + +select + +```html + +``` + +select:disabled, select:d 别名 select[disabled.] + + +```html + +``` + + +option, opt + +```html + +``` + +textarea + +```html + +``` + + +marquee + +```html + +``` + +menu:context, menu:c 别名 menu[type=context]> + +```html + +``` + +menu:toolbar, menu:t 别名 menu[type=toolbar]> + +```html + +``` + +video + +```html + +``` + +audio + +```html + +``` + +html:xml + +```html + +``` + + +keygen + +```html + +``` + +command + +```html + +``` + +button:submit, button:s, btn:s 别名 button[type=submit] + +```html + +``` + +button:reset, button:r, btn:r 别名 button[type=reset] + +```html + +``` + +button:disabled, button:d, btn:d 别名 button[disabled.] + +```html + +``` + +fieldset:disabled, fieldset:d, fset:d, fst:d 别名 fieldset[disabled.] + +```html +
+``` + +bq 别名 blockquote + +```html +
+``` + +fig 别名 figure + +```html +
+``` + +figc 别名 figcaption + +```html +
+``` + +pic 别名 picture + +```html + +``` + +ifr 别名 iframe + +```html + +``` + +emb 别名 embed + +```html + +``` + +obj 别名 object + +```html + +``` + +cap 别名 caption + +```html + +``` + +colg 别名 colgroup + +```html + +``` + +fst, fset 别名 fieldset + +```html +
+``` + +btn 别名 button + +```html + +``` + +optg 别名 optgroup + +```html + +``` + +tarea 别名 textarea + +```html + +``` + + +leg 别名 legend + +```html + +``` + +sect 别名 section + +```html +
+``` + +art 别名 article + +```html +
+``` + +hdr 别名 header + +```html +
+``` + +ftr 别名 footer + +```html +
+``` + +adr 别名 address + +```html +
+``` + +dlg 别名 dialog + +```html + +``` + +str 别名 strong + +```html + +``` + +prog 别名 progress + +```html + +``` + +mn 别名 main + +```html +
+``` + +tem 别名 template + +```html + +``` + +datag 别名 datagrid + +```html + +``` + +datal 别名 datalist + +```html + +``` + +kg 别名 keygen + +```html + +``` + +out 别名 output + +```html + +``` + +det 别名 details + +```html +
+``` + +### HTML 3 + +cmd +Alias of command + +```html + +``` + +doc 别名 html>(head>meta[charset=${charset}]+title{${1:Document}})+body + + +```html + + + + Document + + + + + +``` + +doc4 别名 html>(head>meta[http-equiv="Content-Type" content="text/html;charset=${charset}"]+title{${1:Document}})+body + + +```html + + + + Document + + + + + +``` + + +ri:dpr, ri:d 别名 img:s + +```html + +``` + +ri:viewport, ri:v 别名 img:z + +```html + +``` + +ri:art, ri:a 别名 pic>src:m+img + +```html + + + + +``` + +ri:type, ri:t 别名 pic>src:t+img + +```html + + + + +``` + +html:4t 别名 !!!4t+doc4[lang=${lang}] + +```html + + + + + Document + + + + + +``` + + +html:4s 别名 !!!4s+doc4[lang=${lang}] + +```html + + + + + Document + + + + + +``` + + +html:xt 别名 !!!xt+doc4[xmlns=http://www.w3.org/1999/xhtml xml:lang=${lang}] + + +```html + + + + + Document + + + + + +``` + + +html:xs 别名 !!!xs+doc4[xmlns=http://www.w3.org/1999/xhtml xml:lang=${lang}] + +```html + + + + + Document + + + + + +``` + + +html:xxs 别名 !!!xxs+doc4[xmlns=http://www.w3.org/1999/xhtml xml:lang=${lang}] + +```html + + + + + Document + + + + + +``` + + +html:5 别名 !!!+doc[lang=${lang}] + +```html + + + + + Document + + + + + +``` + +ol+ 别名 ol>li + +```html +
    +
  1. +
+``` + +ul+ 别名 ul>li + +```html +
    +
  • +
+``` + +dl+ 别名 dl>dt+dd + +```html +
+
+
+
+``` + +map+ 别名 map>area + +```html + + + +``` + + +table+ 别名 table>tr>td + +```html + + + + +
+``` + +colgroup+, colg+ 别名 colgroup>col + +```html + + + +``` + +tr+ 别名 tr>td + +```html + + + +``` + +select+ 别名 select>option + +```html + +``` + +optgroup+, optg+ 别名 optgroup>option + +```html + + + +``` + +pic+ 别名 picture>source:srcset+img + +```html + + + + +``` + +!!! + +```html + +``` + +!!!4t + +```html + +``` + + +!!!4s + +```html + +``` + + +!!!xt + +```html + +``` + + +!!!xs + +```html + +``` + + +!!!xxs + +```html + +``` + + +c + +```html + +``` + +cc:ie6 + +```html + +``` + +cc:ie + +```html + +``` + +cc:noie + +```html + + ${child} + +``` + +CSS +-------- + +### 视觉格式 + + +:- | :- +:- | :- +`pos` | position:relative; +`pos:s` | position:static; +`pos:a` | position:absolute; +`pos:r` | position:relative; +`pos:f` | position:fixed; +`t` | top:; +`t:a` | top:auto; +`r` | right:; +`r:a` | right:auto; +`b` | bottom:; +`b:a` | bottom:auto; +`l` | left:; +`l:a` | left:auto; +`z` | z-index:; +`z:a` | z-index:auto; +`fl` | float:left; +`fl:n` | float:none; +`fl:l` | float:left; +`fl:r` | float:right; +`cl` | clear:both; +`cl:n` | clear:none; +`cl:l` | clear:left; +`cl:r` | clear:right; +`cl:b` | clear:both; +`d` | display:block; +`d:n` | display:none; +`d:b` | display:block; +`d:f` | display:flex; +`d:if` | display:inline-flex; +`d:i` | display:inline; +`d:ib` | display:inline-block; +`d:li` | display:list-item; +`d:ri` | display:run-in; +`d:cp` | display:compact; +`d:tb` | display:table; +`d:itb` | display:inline-table; +`d:tbcp` | display:table-caption; +`d:tbcl` | display:table-column; +`d:tbclg` | display:table-column-group; +`d:tbhg` | display:table-header-group; +`d:tbfg` | display:table-footer-group; +`d:tbr` | display:table-row; +`d:tbrg` | display:table-row-group; +`d:tbc` | display:table-cell; +`d:rb` | display:ruby; +`d:rbb` | display:ruby-base; +`d:rbbg` | display:ruby-base-group; +`d:rbt` | display:ruby-text; +`d:rbtg` | display:ruby-text-group; +`v` | visibility:hidden; +`v:v` | visibility:visible; +`v:h` | visibility:hidden; +`v:c` | visibility:collapse; +`ov` | overflow:hidden; +`ov:v` | overflow:visible; +`ov:h` | overflow:hidden; +`ov:s` | overflow:scroll; +`ov:a` | overflow:auto; +`ovx` | overflow-x:hidden; +`ovx:v` | overflow-x:visible; +`ovx:h` | overflow-x:hidden; +`ovx:s` | overflow-x:scroll; +`ovx:a` | overflow-x:auto; +`ovy` | overflow-y:hidden; +`ovy:v` | overflow-y:visible; +`ovy:h` | overflow-y:hidden; +`ovy:s` | overflow-y:scroll; +`ovy:a` | overflow-y:auto; +`ovs` | overflow-style:scrollbar; +`ovs:a` | overflow-style:auto; +`ovs:s` | overflow-style:scrollbar; +`ovs:p` | overflow-style:panner; +`ovs:m` | overflow-style:move; +`ovs:mq` | overflow-style:marquee; +`zoo, zm` | zoom:1; +`cp` | clip:; +`cp:a` | clip:auto; +`cp:r` | clip:rect(top right bottom left); +`rsz` | resize:; +`rsz:n` | resize:none; +`rsz:b` | resize:both; +`rsz:h` | resize:horizontal; +`rsz:v` | resize:vertical; +`cur` | cursor:${pointer}; +`cur:a` | cursor:auto; +`cur:d` | cursor:default; +`cur:c` | cursor:crosshair; +`cur:ha` | cursor:hand; +`cur:he` | cursor:help; +`cur:m` | cursor:move; +`cur:p` | cursor:pointer; +`cur:t` | cursor:text; + +### 边距和填充 + +:- | :- +:- | :- +`m` | margin:; +`m:a` | margin:auto; +`mt` | margin-top:; +`mt:a` | margin-top:auto; +`mr` | margin-right:; +`mr:a` | margin-right:auto; +`mb` | margin-bottom:; +`mb:a` | margin-bottom:auto; +`ml` | margin-left:; +`ml:a` | margin-left:auto; +`p` | padding:; +`pt` | padding-top:; +`pr` | padding-right:; +`pb` | padding-bottom:; +`pl` | padding-left:; + +### 盒子尺寸 + +:- | :- +:- | :- +`bxz` | box-sizing:border-box; +`bxz:cb` | box-sizing:content-box; +`bxz:bb` | box-sizing:border-box; +`bxsh` | box-shadow:inset hoff voff blur color; +`bxsh:r` | box-shadow:inset hoff voff blur spread rgb(0, 0, 0); +`bxsh:ra` | box-shadow:inset h v blur spread rgba(0, 0, 0, .5); +`bxsh:n` | box-shadow:none; +`w` | width:; +`w:a` | width:auto; +`h` | height:; +`h:a` | height:auto; +`maw` | max-width:; +`maw:n` | max-width:none; +`mah` | max-height:; +`mah:n` | max-height:none; +`miw` | min-width:; +`mih` | min-height:; + +### 字体 + + +:- | :- +:- | :- +`f` | font:; +`f+` | font:1em Arial,sans-serif; +`fw` | font-weight:; +`fw:n` | font-weight:normal; +`fw:b` | font-weight:bold; +`fw:br` | font-weight:bolder; +`fw:lr` | font-weight:lighter; +`fs` | font-style:${italic}; +`fs:n` | font-style:normal; +`fs:i` | font-style:italic; +`fs:o` | font-style:oblique; +`fv` | font-variant:; +`fv:n` | font-variant:normal; +`fv:sc` | font-variant:small-caps; +`fz` | font-size:; +`fza` | font-size-adjust:; +`fza:n` | font-size-adjust:none; +`ff` | font-family:; +`ff:s` | font-family:serif; +`ff:ss` | font-family:sans-serif; +`ff:c` | font-family:cursive; +`ff:f` | font-family:fantasy; +`ff:m` | font-family:monospace; +`ff:a` | font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; +`ff:t` | font-family: "Times New Roman", Times, Baskerville, Georgia, serif; +`ff:v` | font-family: Verdana, Geneva, sans-serif; +`fef` | font-effect:; +`fef:n` | font-effect:none; +`fef:eg` | font-effect:engrave; +`fef:eb` | font-effect:emboss; +`fef:o` | font-effect:outline; +`fem` | font-emphasize:; +`femp` | font-emphasize-position:; +`femp:b` | font-emphasize-position:before; +`femp:a` | font-emphasize-position:after; +`fems` | font-emphasize-style:; +`fems:n` | font-emphasize-style:none; +`fems:ac` | font-emphasize-style:accent; +`fems:dt` | font-emphasize-style:dot; +`fems:c` | font-emphasize-style:circle; +`fems:ds` | font-emphasize-style:disc; +`fsm` | font-smooth:; +`fsm:a` | font-smooth:auto; +`fsm:n` | font-smooth:never; +`fsm:aw` | font-smooth:always; +`fst` | font-stretch:; +`fst:n` | font-stretch:normal; +`fst:uc` | font-stretch:ultra-condensed; +`fst:ec` | font-stretch:extra-condensed; +`fst:c` | font-stretch:condensed; +`fst:sc` | font-stretch:semi-condensed; +`fst:se` | font-stretch:semi-expanded; +`fst:e` | font-stretch:expanded; +`fst:ee` | font-stretch:extra-expanded; +`fst:ue` | font-stretch:ultra-expanded; + +### 背景 + +:- | :- +:- | :- +`bg` | background:#000; +`bg+` | background:#fff url() 0 0 no-repeat; +`bg:n` | background:none; +`bgc` | background-color:#fff; +`bgc:t` | background-color:transparent; +`bgi` | background-image:url(); +`bgi:n` | background-image:none; +`bgr` | background-repeat:; +`bgr:n` | background-repeat:no-repeat; +`bgr:x` | background-repeat:repeat-x; +`bgr:y` | background-repeat:repeat-y; +`bgr:sp` | background-repeat:space; +`bgr:rd` | background-repeat:round; +`bga` | background-attachment:; +`bga:f` | background-attachment:fixed; +`bga:s` | background-attachment:scroll; +`bgp` | background-position:0 0; +`bgpx` | background-position-x:; +`bgpy` | background-position-y:; +`bgbk` | background-break:; +`bgbk:bb` | background-break:bounding-box; +`bgbk:eb` | background-break:each-box; +`bgbk:c` | background-break:continuous; +`bgcp` | background-clip:padding-box; +`bgcp:bb` | background-clip:border-box; +`bgcp:pb` | background-clip:padding-box; +`bgcp:cb` | background-clip:content-box; +`bgcp:nc` | background-clip:no-clip; +`bgo` | background-origin:; +`bgo:pb` | background-origin:padding-box; +`bgo:bb` | background-origin:border-box; +`bgo:cb` | background-origin:content-box; +`bgsz` | background-size:; +`bgsz:a` | background-size:auto; +`bgsz:ct` | background-size:contain; +`bgsz:cv` | background-size:cover; + +### Lists + +:- | :- +:- | :- +`lis` | list-style:; +`lis:n` | list-style:none; +`lisp` | list-style-position:; +`lisp:i` | list-style-position:inside; +`lisp:o` | list-style-position:outside; +`list` | list-style-type:; +`list:n` | list-style-type:none; +`list:d` | list-style-type:disc; +`list:c` | list-style-type:circle; +`list:s` | list-style-type:square; +`list:dc` | list-style-type:decimal; +`list:dclz` | list-style-type:decimal-leading-zero; +`list:lr` | list-style-type:lower-roman; +`list:ur` | list-style-type:upper-roman; +`lisi` | list-style-image:; +`lisi:n` | list-style-image:none; + +### Tables + +:- | :- +:- | :- +`tbl` | table-layout:; +`tbl:a` | table-layout:auto; +`tbl:f` | table-layout:fixed; +`cps` | caption-side:; +`cps:t` | caption-side:top; +`cps:b` | caption-side:bottom; +`ec` | empty-cells:; +`ec:s` | empty-cells:show; +`ec:h` | empty-cells:hide; + +### 颜色 + +:- | :- +:- | :- +`c` | color:#000; +`c:r` | color:rgb(0, 0, 0); +`c:ra` | color:rgba(0, 0, 0, .5); +`op` | opacity:; + +### 文本 + + +:- | :- +:- | :- +`va` | vertical-align:top; +`va:sup` | vertical-align:super; +`va:t` | vertical-align:top; +`va:tt` | vertical-align:text-top; +`va:m` | vertical-align:middle; +`va:bl` | vertical-align:baseline; +`va:b` | vertical-align:bottom; +`va:tb` | vertical-align:text-bottom; +`va:sub` | vertical-align:sub; +`ta` | text-align:left; +`ta:l` | text-align:left; +`ta:c` | text-align:center; +`ta:r` | text-align:right; +`ta:j` | text-align:justify; +`ta-lst` | text-align-last:; +`tal:a` | text-align-last:auto; +`tal:l` | text-align-last:left; +`tal:c` | text-align-last:center; +`tal:r` | text-align-last:right; +`td` | text-decoration:none; +`td:n` | text-decoration:none; +`td:u` | text-decoration:underline; +`td:o` | text-decoration:overline; +`td:l` | text-decoration:line-through; +`te` | text-emphasis:; +`te:n` | text-emphasis:none; +`te:ac` | text-emphasis:accent; +`te:dt` | text-emphasis:dot; +`te:c` | text-emphasis:circle; +`te:ds` | text-emphasis:disc; +`te:b` | text-emphasis:before; +`te:a` | text-emphasis:after; +`th` | text-height:; +`th:a` | text-height:auto; +`th:f` | text-height:font-size; +`th:t` | text-height:text-size; +`th:m` | text-height:max-size; +`ti` | text-indent:; +`ti:-` | text-indent:-9999px; +`tj` | text-justify:; +`tj:a` | text-justify:auto; +`tj:iw` | text-justify:inter-word; +`tj:ii` | text-justify:inter-ideograph; +`tj:ic` | text-justify:inter-cluster; +`tj:d` | text-justify:distribute; +`tj:k` | text-justify:kashida; +`tj:t` | text-justify:tibetan; +`to` | text-outline:; +`to+` | text-outline:0 0 #000; +`to:n` | text-outline:none; +`tr` | text-replace:; +`tr:n` | text-replace:none; +`tt` | text-transform:uppercase; +`tt:n` | text-transform:none; +`tt:c` | text-transform:capitalize; +`tt:u` | text-transform:uppercase; +`tt:l` | text-transform:lowercase; +`tw` | text-wrap:; +`tw:n` | text-wrap:normal; +`tw:no` | text-wrap:none; +`tw:u` | text-wrap:unrestricted; +`tw:s` | text-wrap:suppress; +`tsh` | text-shadow:hoff voff blur #000; +`tsh:r` | text-shadow:h v blur rgb(0, 0, 0); +`tsh:ra` | text-shadow:h v blur rgba(0, 0, 0, .5); +`tsh+` | text-shadow:0 0 0 #000; +`tsh:n` | text-shadow:none; +`lh` | line-height:; +`lts` | letter-spacing:; +`lts-n` | letter-spacing:normal; +`whs` | white-space:; +`whs:n` | white-space:normal; +`whs:p` | white-space:pre; +`whs:nw` | white-space:nowrap; +`whs:pw` | white-space:pre-wrap; +`whs:pl` | white-space:pre-line; +`whsc` | white-space-collapse:; +`whsc:n` | white-space-collapse:normal; +`whsc:k` | white-space-collapse:keep-all; +`whsc:l` | white-space-collapse:loose; +`whsc:bs` | white-space-collapse:break-strict; +`whsc:ba` | white-space-collapse:break-all; +`wob` | word-break:; +`wob:n` | word-break:normal; +`wob:k` | word-break:keep-all; +`wob:ba` | word-break:break-all; +`wos` | word-spacing:; +`wow` | word-wrap:; +`wow:nm` | word-wrap:normal; +`wow:n` | word-wrap:none; +`wow:u` | word-wrap:unrestricted; +`wow:s` | word-wrap:suppress; +`wow:b` | word-wrap:break-word; + +### Border + + +:- | :- +:- | :- +`bd` | border:; +`bd+` | border:1px solid #000; +`bd:n` | border:none; +`bdbk` | border-break:close; +`bdbk:c` | border-break:close; +`bdcl` | border-collapse:; +`bdcl:c` | border-collapse:collapse; +`bdcl:s` | border-collapse:separate; +`bdc` | border-color:#000; +`bdc:t` | border-color:transparent; +`bdi` | border-image:url(); +`bdi:n` | border-image:none; +`bdti` | border-top-image:url(); +`bdti:n` | border-top-image:none; +`bdri` | border-right-image:url(); +`bdri:n` | border-right-image:none; +`bdbi` | border-bottom-image:url(); +`bdbi:n` | border-bottom-image:none; +`bdli` | border-left-image:url(); +`bdli:n` | border-left-image:none; +`bdci` | border-corner-image:url(); +`bdci:n` | border-corner-image:none; +`bdci:c` | border-corner-image:continue; +`bdtli` | border-top-left-image:url(); +`bdtli:n` | border-top-left-image:none; +`bdtli:c` | border-top-left-image:continue; +`bdtri` | border-top-right-image:url(); +`bdtri:n` | border-top-right-image:none; +`bdtri:c` | border-top-right-image:continue; +`bdbri` | border-bottom-right-image:url(); +`bdbri:n` | border-bottom-right-image:none; +`bdbri:c` | border-bottom-right-image:continue; +`bdbli` | border-bottom-left-image:url(); +`bdbli:n` | border-bottom-left-image:none; +`bdbli:c` | border-bottom-left-image:continue; +`bdf` | border-fit:repeat; +`bdf:c` | border-fit:clip; +`bdf:r` | border-fit:repeat; +`bdf:sc` | border-fit:scale; +`bdf:st` | border-fit:stretch; +`bdf:ow` | border-fit:overwrite; +`bdf:of` | border-fit:overflow; +`bdf:sp` | border-fit:space; +`bdlen` | border-length:; +`bdlen:a` | border-length:auto; +`bdsp` | border-spacing:; +`bds` | border-style:; +`bds:n` | border-style:none; +`bds:h` | border-style:hidden; +`bds:dt` | border-style:dotted; +`bds:ds` | border-style:dashed; +`bds:s` | border-style:solid; +`bds:db` | border-style:double; +`bds:dtds` | border-style:dot-dash; +`bds:dtdtds` | border-style:dot-dot-dash; +`bds:w` | border-style:wave; +`bds:g` | border-style:groove; +`bds:r` | border-style:ridge; +`bds:i` | border-style:inset; +`bds:o` | border-style:outset; +`bdw` | border-width:; +`bdt, bt` | border-top:; +`bdt+` | border-top:1px solid #000; +`bdt:n` | border-top:none; +`bdtw` | border-top-width:; +`bdts` | border-top-style:; +`bdts:n` | border-top-style:none; +`bdtc` | border-top-color:#000; +`bdtc:t` | border-top-color:transparent; +`bdr, br` | border-right:; +`bdr+` | border-right:1px solid #000; +`bdr:n` | border-right:none; +`bdrw` | border-right-width:; +`bdrst` | border-right-style:; +`bdrst:n` | border-right-style:none; +`bdrc` | border-right-color:#000; +`bdrc:t` | border-right-color:transparent; +`bdb, bb` | border-bottom:; +`bdb+` | border-bottom:1px solid #000; +`bdb:n` | border-bottom:none; +`bdbw` | border-bottom-width:; +`bdbs` | border-bottom-style:; +`bdbs:n` | border-bottom-style:none; +`bdbc` | border-bottom-color:#000; +`bdbc:t` | border-bottom-color:transparent; +`bdl, bl` | border-left:; +`bdl+` | border-left:1px solid #000; +`bdl:n` | border-left:none; +`bdlw` | border-left-width:; +`bdls` | border-left-style:; +`bdls:n` | border-left-style:none; +`bdlc` | border-left-color:#000; +`bdlc:t` | border-left-color:transparent; +`bdrs` | border-radius:; +`bdtrrs` | border-top-right-radius:; +`bdtlrs` | border-top-left-radius:; +`bdbrrs` | border-bottom-right-radius:; +`bdblrs` | border-bottom-left-radius:; + +### 生成的内容 + +:- | :- +:- | :- +`cnt` | content:''; +`cnt:n, ct:n` | content:normal; +`cnt:oq, ct:oq` | content:open-quote; +`cnt:noq, ct:noq` | content:no-open-quote; +`cnt:cq, ct:cq` | content:close-quote; +`cnt:ncq, ct:ncq` | content:no-close-quote; +`cnt:a, ct:a` | content:attr(); +`cnt:c, ct:c` | content:counter(); +`cnt:cs, ct:cs` | content:counters(); +`ct` | content:; +`q` | quotes:; +`q:n` | quotes:none; +`q:ru` | quotes:'\00AB' '\00BB' '\201E' '\201C'; +`q:en` | quotes:'\201C' '\201D' '\2018' '\2019'; +`coi` | counter-increment:; +`cor` | counter-reset:; + +### Outline + +:- | :- +:- | :- +`ol` | outline:; +`ol:n` | outline:none; +`olo` | outline-offset:; +`olw` | outline-width:; +`olw:tn` | outline-width:thin; +`olw:m` | outline-width:medium; +`olw:tc` | outline-width:thick; +`ols` | outline-style:; +`ols:n` | outline-style:none; +`ols:dt` | outline-style:dotted; +`ols:ds` | outline-style:dashed; +`ols:s` | outline-style:solid; +`ols:db` | outline-style:double; +`ols:g` | outline-style:groove; +`ols:r` | outline-style:ridge; +`ols:i` | outline-style:inset; +`ols:o` | outline-style:outset; +`olc` | outline-color:#000; +`olc:i` | outline-color:invert; + +### Print + +:- | :- +:- | :- +`pgbb` | page-break-before:; +`pgbb:au` | page-break-before:auto; +`pgbb:al` | page-break-before:always; +`pgbb:l` | page-break-before:left; +`pgbb:r` | page-break-before:right; +`pgbi` | page-break-inside:; +`pgbi:au` | page-break-inside:auto; +`pgbi:av` | page-break-inside:avoid; +`pgba` | page-break-after:; +`pgba:au` | page-break-after:auto; +`pgba:al` | page-break-after:always; +`pgba:l` | page-break-after:left; +`pgba:r` | page-break-after:right; +`orp` | orphans:; +`wid` | widows:; + +### Others + +:- | :- +:- | :- +`!` | !important + +#### @f + +```css +@font-face { + font-family:; + src:url(|); +} +``` + +#### @f+ + +```css +@font-face { + font-family: 'FontName'; + src: url('FileName.eot'); + src: url('FileName.eot?#iefix') format('embedded-opentype'), + url('FileName.woff') format('woff'), + url('FileName.ttf') format('truetype'), + url('FileName.svg#FontName') format('svg'); + font-style: normal; + font-weight: normal; +} +``` +#### @i, @import + +```css +@import url(); +``` + +#### @kf + +```css +@-webkit-keyframes identifier { + from { } + to { } +} +@-o-keyframes identifier { + from { } + to { } +} +@-moz-keyframes identifier { + from { } + to { } +} +@keyframes identifier { + from { } + to { } +} +``` + +#### @m, @media + +```css +@media screen { + +} +``` + +### transform + +:- | :- +:- | :- +`trf` | transform:; +`trf:r` | transform: rotate(angle); +`trf:rx` | transform: rotateX(angle); +`trf:ry` | transform: rotateY(angle); +`trf:rz` | transform: rotateZ(angle); +`trf:sc` | transform: scale(x, y); +`trf:sc3` | transform: scale3d(x, y, z); +`trf:scx` | transform: scaleX(x); +`trf:scy` | transform: scaleY(y); +`trf:scz` | transform: scaleZ(z); +`trf:skx` | transform: skewX(angle); +`trf:sky` | transform: skewY(angle); +`trf:t` | transform: translate(x, y); +`trf:t3` | transform: translate3d(tx, ty, tz); +`trf:tx` | transform: translateX(x); +`trf:ty` | transform: translateY(y); +`trf:tz` | transform: translateZ(z); +`trfo` | transform-origin:; +`trfs` | transform-style:preserve-3d; + +### Other + + +:- | :- +:- | :- +`ac` | align-content:; +`ac:c` | align-content:center; +`ac:fe` | align-content:flex-end; +`ac:fs` | align-content:flex-start; +`ac:s` | align-content:stretch; +`ac:sa` | align-content:space-around; +`ac:sb` | align-content:space-between; +`ai` | align-items:; +`ai:b` | align-items:baseline; +`ai:c` | align-items:center; +`ai:fe` | align-items:flex-end; +`ai:fs` | align-items:flex-start; +`ai:s` | align-items:stretch; +`ap` | appearance:${none}; +`as` | align-self:; +`as:a` | align-self:auto; +`as:b` | align-self:baseline; +`as:c` | align-self:center; +`as:fe` | align-self:flex-end; +`as:fs` | align-self:flex-start; +`as:s` | align-self:stretch; +`bfv` | backface-visibility:; +`bfv:h` | backface-visibility:hidden; +`bfv:v` | backface-visibility:visible; +`bg:ie` | filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='x.png',sizingMethod='crop'); +`cm` | /* ${child} */ +`colm` | columns:; +`colmc` | column-count:; +`colmf` | column-fill:; +`colmg` | column-gap:; +`colmr` | column-rule:; +`colmrc` | column-rule-color:; +`colmrs` | column-rule-style:; +`colmrw` | column-rule-width:; +`colms` | column-span:; +`colmw` | column-width:; +`d:ib+` | display: inline-block;
*display: inline;
*zoom: 1; +`jc` | justify-content:; +`jc:c` | justify-content:center; +`jc:fe` | justify-content:flex-end; +`jc:fs` | justify-content:flex-start; +`jc:sa` | justify-content:space-around; +`jc:sb` | justify-content:space-between; +`mar` | max-resolution:res; +`mir` | min-resolution:res; +`op+` | opacity: ; filter: alpha(opacity=); +`op:ie` | filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100); +`op:ms` | -ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)'; +`ord` | order:; +`ori` | orientation:; +`ori:l` | orientation:landscape; +`ori:p` | orientation:portrait; +`tov` | text-overflow:${ellipsis}; +`tov:c` | text-overflow:clip; +`tov:e` | text-overflow:ellipsis; +`trs` | transition:prop time; +`trsde` | transition-delay:time; +`trsdu` | transition-duration:time; +`trsp` | transition-property:prop; +`trstf` | transition-timing-function:tfunc; +`us` | user-select:${none}; +`wfsm` | -webkit-font-smoothing:${antialiased}; +`wfsm:a` | -webkit-font-smoothing:antialiased; +`wfsm:n` | -webkit-font-smoothing:none; +`wfsm:s, wfsm:sa` | -webkit-font-smoothing:subpixel-antialiased; +`wm` | writing-mode:lr-tb; +`wm:btl` | writing-mode:bt-lr; +`wm:btr` | writing-mode:bt-rl; +`wm:lrb` | writing-mode:lr-bt; +`wm:lrt` | writing-mode:lr-tb; +`wm:rlb` | writing-mode:rl-bt; +`wm:rlt` | writing-mode:rl-tb; +`wm:tbl` | writing-mode:tb-lr; +`wm:tbr` | writing-mode:tb-rl; + + +### animation + +:- | :- +:- | :- +`anim` | animation:; +`anim-` | animation:name duration timing-function delay iteration-count direction fill-mode; +`animdel` | animation-delay:time; +`animdir` | animation-direction:normal; +`animdir:a` | animation-direction:alternate; +`animdir:ar` | animation-direction:alternate-reverse; +`animdir:n` | animation-direction:normal; +`animdir:r` | animation-direction:reverse; +`animdur` | animation-duration:0s; +`animfm` | animation-fill-mode:both; +`animfm:b` | animation-fill-mode:backwards; +`animfm:bt, animfm:bh` | animation-fill-mode:both; +`animfm:f` | animation-fill-mode:forwards; +`animic` | animation-iteration-count:1; +`animic:i` | animation-iteration-count:infinite; +`animn` | animation-name:none; +`animps` | animation-play-state:running; +`animps:p` | animation-play-state:paused; +`animps:r` | animation-play-state:running; +`animtf` | animation-timing-function:linear; +`animtf:cb` | animation-timing-function:cubic-bezier(0.1, 0.7, 1.0, 0.1); +`animtf:e` | animation-timing-function:ease; +`animtf:ei` | animation-timing-function:ease-in; +`animtf:eio` | animation-timing-function:ease-in-out; +`animtf:eo` | animation-timing-function:ease-out; +`animtf:l` | animation-timing-function:linear; + +### flex + +:- | :- +:- | :- +`fx` | flex:; +`fxb` | flex-basis:; +`fxd` | flex-direction:; +`fxd:c` | flex-direction:column; +`fxd:cr` | flex-direction:column-reverse; +`fxd:r` | flex-direction:row; +`fxd:rr` | flex-direction:row-reverse; +`fxf` | flex-flow:; +`fxg` | flex-grow:; +`fxsh` | flex-shrink:; +`fxw` | flex-wrap: ; +`fxw:n` | flex-wrap:nowrap; +`fxw:w` | flex-wrap:wrap; +`fxw:wr` | flex-wrap:wrap-reverse; + +XSL +---- + +### XSL + +tmatch, tm + +```xml + +``` + + +tname, tn + +```xml + +``` + +call + +```xml + +``` + +ap + +```xml + +``` + +api + +```xml + +``` + +imp + +```xml + +``` + +inc + +```xml + +``` + +ch + +```xml + +``` + +xsl:when, wh + +```xml + +``` + +ot + +```xml + +``` + +if + +```xml + +``` + +par + +```xml + +``` + +pare + +```xml + +``` + +var + +```xml + +``` + +### XSL + +vare + +```xml + +``` + +wp + +```xml + +``` + +key + +```xml + +``` + +elem + +```xml + +``` + +attr + +```xml + +``` + +attrs + +```xml + +``` + + +cp + +```xml + +``` + +co + +```xml + +``` + +val + +```xml + +``` + +each, for + +```xml + +``` + +tex + +```xml + +``` + +com + +```xml + +``` + +msg + +```xml + +``` + +fall + +```xml + +``` + +### XSL + +num + +```xml + +``` + +nam + +```xml + +``` + + +pres + +```xml + +``` + +strip + +```xml + +``` + +proc + +```xml + +``` + + +sort + +```xml + +``` + +choose+ A别名 xsl:choose>xsl:when+xsl:otherwise + +```xml + + + + +``` + +xsl 别名 !!!+xsl:stylesheet[version=1.0 xmlns:xsl=http://www.w3.org/1999/XSL/Transform]>{ | } + +```xml + + +``` + + +!!! + +```xml + +``` + +另见 +-------- + +* [Emmet Cheat sheet](https://docs.emmet.io/cheat-sheet/) _(docs.emmet.io)_ \ No newline at end of file diff --git a/docs/npm.md b/docs/npm.md index 0cf67c2..70df322 100644 --- a/docs/npm.md +++ b/docs/npm.md @@ -138,6 +138,16 @@ npm unpublish @ 注意：如果您取消发布整个包，则必须在 24 小时后才能发布该包的任何新版本。 +### 发布包 npmjs.org + +```bash +npm publish +# 第一次需要指定公开参数 +npm publish --access public +``` + +发布公开包，到 npmjs.org + 配置 --- diff --git a/docs/quickreference.md b/docs/quickreference.md index dc47b5f..3ce8c78 100644 --- a/docs/quickreference.md +++ b/docs/quickreference.md @@ -208,6 +208,7 @@ const school =
学校
; `` | 黄色 `` | 紫色 `` 或 \`\` | 绿`色` +`` 或 `~~删除~~` | ~~红色~~ diff --git a/docs/typescript.md b/docs/typescript.md index a9dcac8..38e4c3c 100644 --- a/docs/typescript.md +++ b/docs/typescript.md @@ -1258,6 +1258,7 @@ class MyComponent extends React.Component { ``` ### 泛型组件 + ```tsx // 一个泛型组件 diff --git a/scripts/assets/emmet.svg b/scripts/assets/emmet.svg new file mode 100644 index 0000000..e9a0ec1 --- /dev/null +++ b/scripts/assets/emmet.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/scripts/style.css b/scripts/style.css index 29926b3..2714828 100644 --- a/scripts/style.css +++ b/scripts/style.css @@ -203,8 +203,7 @@ table td:first-child>code { --text-opacity: 1; color: rgb(5 150 105/var(--text-opacity)); } -table td:first-child>del>code { - text-decoration: inherit; +table td > del, table td:first-child > del > code, .wrap-body p > del > code { color: var(--color-danger-fg); } @@ -844,16 +843,7 @@ body:not(.home) .h2wrap > h2 a::after { } } -@media (min-width: 768px) { - .home-card { - grid-template-columns: repeat(4,minmax(0,1fr)); - } - .wrap-header.h3wrap > .wrap-body { - overflow: initial; - } -} - -@media (min-width: 375px) { +@media only screen and (max-width: 375px) { .header-nav .title { font-size: 1rem; } @@ -877,6 +867,9 @@ body:not(.home) .h2wrap > h2 a::after { .wrap-header.h3wrap > .wrap-body { overflow: auto; } + .tooltip:hover .tooltiptext { + display: none; + } .h1wrap-body { gap: 2rem; } @@ -893,4 +886,16 @@ body:not(.home) .h2wrap > h2 a::after { .footer-wrap { font-size: 0.75rem; } -} \ No newline at end of file +} + +@media (min-width: 768px) { + .home-card { + grid-template-columns: repeat(4,minmax(0,1fr)); + } + .wrap-header.h3wrap > .wrap-body { + overflow: initial; + } + .tooltip:hover .tooltiptext { + display: inline-block; + } +}