emmet(Zen coding)前端写代码神器

emmet前身zen coding。支持sublime Text。

基本上,大多数文本编辑器有允许你存储和再利用常用的代码块,称为“片段”。而片段是提高生产率的一个好方法,所有的实现都是常见的陷阱:你需要定义段第一,你不能在运行时扩展。

埃米特以片段的想法到一个新的水平:你可以像CSS表达式类型可以动态解析,并产生输出取决于你输入的缩写。埃米特是开发和优化Web开发者的工作依赖于HTML / XML和CSS,但可以用编程语言太。

官网:http://docs.emmet.io/

api:http://docs.emmet.io/cheat-sheet/

嵌套操作符

嵌套运算符用于在生成树中的位置的缩写元素:是否应该放置在内部或附近的上下文元素。

Child: >

使用 > 相互嵌套元素:

div>ul>li

...将产生的

<div>
    <ul>
        <li></li>
    </ul>
</div>

Sibling: +

使用+运算符将元素放置在同一个级别上:

div+p+bq

...将产生的

<div></div>
<p></p>
<blockquote></blockquote>

Climb-up: ^

随着 > 你要降下的所有同级元素的生成树和位置将解决对最最深的元素:

div+div>p>span+em

...将扩展到

<div></div>
<div>
    <p><span></span><em></em></p>
</div>

随着 ^ 操作符,你可以爬上一个层次的树和变化的背景下,下面的元素应该出现:

div+div>p>span+em^bq

...输出

<div></div>
<div>
    <p><span></span><em></em></p>
    <blockquote></blockquote>
</div>

您可以使用许多 ^ 运算符如你喜欢,每个运营商将移动一级:

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

...将输出

<div></div>
<div>
    <p><span></span><em></em></p>
</div>
<blockquote></blockquote>

Multiplication: *

随着 * 预算符可以定义元素应该输出多少次:

ul>li*5

...输出

<ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
</ul>

Grouping: ()

括号的使用Emmet在复杂的缩写子树分组用户:

div>(header>ul>li*2>a)+footer>p

...扩展到

<div>
    <header>
        <ul>
            <li><a href=""></a></li>
            <li><a href=""></a></li>
        </ul>
    </header>
    <footer>
        <p></p>
    </footer>
</div>

如果你使用浏览器的DOM,你可能觉得组文档片段:每个组包含缩写子树和所有以下元素插入在同一水平作为集团的第一个元素。

你们可以互相嵌套,并将它们与乘法运算的算子结合起来:

(div>dl>(dt+dd)*3)+footer>p

...生成

<div>
    <dl>
        <dt></dt>
        <dd></dd>
        <dt></dt>
        <dd></dd>
        <dt></dt>
        <dd></dd>
    </dl>
</div>
<footer>
    <p></p>
</footer>

与组,您可以从字面上写满页标记了一个单一的缩写,但请不要这样做。

属性算子

属性运算符用于修改输出元素的属性。例如,在HTML和XML可以快速添加类属性来生成元。

ID and CLASS

在CSS,你使用元素# ID和elem.class符号达到元素指定id或class属性。在蚂蚁,你可以使用同样的语法来添加这些属性来指定元素:

div#header+div.page+div#footer.class1.class2.class3

...输出

<div id="header"></div>
<div class="page"></div>
<div id="footer" class="class1 class2 class3"></div>

自定义属性

您可以使用[属性]符号(如CSS)添加自定义属性到你的元素:

td[title="Hello world!" colspan=3]

...输出

<td title="Hello world!" colspan="3"></td>
  • 你可以将尽可能多的属性,如你喜欢里面方括号。
  • 你不要有指定属性值:TD ColSpan [标题]会产生< TD ColSpan =“”标题=”>定位停驻点在每个空的属性(如果你的编辑器支持它们)。
  • 可以使用单引号或双引号来引用属性值。

Item numbering: $

与乘法*运算符您可以重复元素,但与$您可以数他们。将$操作符输入元素的名称、属性的名称或属性的值,以输出当前数的重复元素:

ul>li.item$*5

...输出

<ul>
    <li class="item1"></li>
    <li class="item2"></li>
    <li class="item3"></li>
    <li class="item4"></li>
    <li class="item5"></li>
</ul>

你可以使用多个$在连续零数字键盘:

ul>li.item$$$*5

...

<ul>
    <li class="item001"></li>
    <li class="item002"></li>
    <li class="item003"></li>
    <li class="item004"></li>
    <li class="item005"></li>
</ul>

更改编号基础和方向

与@修改器,您可以更改编号方向(上升或下降)和基(例如开始值)。

例如,改变方向,增加@ -在$:

ul>li.item$@-*5

...

<ul>
    <li class="item5"></li>
    <li class="item4"></li>
    <li class="item3"></li>
    <li class="item2"></li>
    <li class="item1"></li>
</ul>

要改变计数器基准值,添加“@”改为$:

ul>li.item$@3*5

...

<ul>
    <li class="item3"></li>
    <li class="item4"></li>
    <li class="item5"></li>
    <li class="item6"></li>
    <li class="item7"></li>
</ul>

你们可以一起使用这些修饰词:

ul>li.item$@-3*5

...

<ul>
    <li class="item7"></li>
    <li class="item6"></li>
    <li class="item5"></li>
    <li class="item4"></li>
    <li class="item3"></li>
</ul>

Text: {}

可以使用花括号添加文本到元素:

a{Click me}

...

<a href="">Click me</a>

请注意{text}使用作为一个单独的元素解析(like, divp 等)但在元素后写的特殊意义。例如 a{click} 和 a>{click}将产生相同的输出,但a{click}+b{here} and a>{click}+b{here}不会:

<!-- a{click}+b{here} -->
<a href="">click</a><b>here</b>

<!-- a>{click}+b{here} -->
<a href="">click<b>here</b></a>

In second example the <b> element is placed inside <a> element. And that’s the difference: when {text} is written right after element, it doesn’t change parent context. Here’s more complex example showing why it is important:

在第二个例子中,元素被放置在<元素>元素。这是不同的:当{文本}是在元素后写的,它不改变父上下文。这里的更复杂的例子说明为什么它是重要的:

p>{Click }+a{here}+{ to continue}

...

<p>Click <a href="">here</a> to continue</p>

In this example, to write Click here to continue inside <p> element we have explicitly move down the tree with > operator after p, but in case of a element we don’t have to, since we need <a> element with here word only, without changing parent context.

For comparison, here’s the same abbreviation written without child > operator:

在这个例子中,对写点击这里继续<p>元素内我们有明确下移树>算子P后,但在一个元素的情况下我们不必,因为我们需要< >元素只有在词,不改变父上下文。

为了比较,这里的缩写写的是没有儿童>操作符:

p{Click }+a{here}+{ to continue}

...

<p>Click </p>
<a href="">here</a> to continue

Notes on abbreviation formatting

关于缩写格式的说明

When you get familiar with Emmet’s abbreviations syntax, you may want to use some formatting to make your abbreviations more readable. For example, use spaces between elements and operators, like this:

当你熟悉埃梅特缩写语法,你可以用一些格式使你更可读的缩写。例如,元素和运营商之间使用空格,这样:

(header > ul.nav > li*5) + footer

...

But it won’t work, because space is a stop symbol where Emmet stops abbreviation parsing.

Many users mistakenly think that each abbreviation should be written in a new line, but they are wrong: you can type and expand abbreviation anywhere in the text:

但它不会工作,因为空间是一个停止标志,埃米特停止缩写解析。

许多用户误认为每一个缩写都应该写在一个新的直线上,但它们是错误的:你可以在文本的任何地方输入和扩展缩写:

This is why Emmet needs some indicators (like spaces) where it should stop parsing to not expand anything that you don’t need. If you’re still thinking that such formatting is required for complex abbreviations to make them more readable:

  • Abbreviations are not a template language, they don’t have to be “readable”, they have to be “quickly expandable and removable”.
  • You don’t really need to write complex abbreviations. Stop thinking that “typing” is the slowest process in web-development. You’ll quickly find out that constructing a single complex abbreviation is much slower and error-prone than constructing and typing a few short ones.

这就是为什么蚂蚁需要一些指标(如空格),应停止解析不扩大你不需要的东西。如果你还认为这样的格式是需要复杂的缩写,使他们更可读:

  • 缩写不是一种模板语言,它们不必是“可读性”,它们必须是“快速可扩展和可移动”。
  • 你真的不需要写复杂的缩写。不要以为“打字”是网络发展最慢的过程。你会很快发现,构建一个单一的复杂的缩写是慢得多,容易出错,比建设和键入一些短的。

以上翻译自:http://docs.emmet.io/abbreviations/syntax/

Zen CSS properties

Based on CSS 3 draft specification

Property                                    Alias

Special Rules

@import url();                              @i
@mediaprint{                              @m
    
    }
@font-face {                                @f
    font-family:;
    src:url();
    }
!important                                  !
expression()                                exp

Properties Groups

Sorting Methods

  • Positioning
  • Box behavior and properties
  • Sizing
  • Color appearance
  • Special content types
  • Text
  • Visual properties
  • Print

Positioning

position:;                                  pos
position:static;                            pos:s
position:absolute;                          pos:a
position:relative;                          pos:r
position:fixed;                             pos:f
top:;                                       t
top:auto;                                   t:a
right:;                                     r
right:auto;                                 r:a
bottom:;                                    b
bottom:auto;                                b:a
left:;                                      l
left:auto;                                  l:a
z-index:;                                   z
z-index:auto;                               z:a

Box behavior and properties

float:;                                     fl
float:none;                                 fl:n
float:left;                                 fl:l
float:right;                                fl:r
clear:;                                     cl
clear:none;                                 cl:n
clear:left;                                 cl:l
clear:right;                                cl:r
clear:both;                                 cl:b
display:;                                   d
display:none;                               d:n
display:block;                              d:b
display:inline;                             d:i
display:inline-block;                       d:ib
display:-moz-inline-box;                   d:mib
display:-moz-inline-stack;                 d:mis
display:list-item;                          d:li
display:run-in;                             d:ri
display:compact;                            d:cp
display:table;                              d:tb
display:inline-table;                       d:itb
display:table-caption;                      d:tbcp
display:table-column;                       d:tbcl
display:table-column-group;                 d:tbclg
display:table-header-group;                 d:tbhg
display:table-footer-group;                 d:tbfg
display:table-row;                          d:tbr
display:table-row-group;                    d:tbrg
display:table-cell;                         d:tbc
visibility:;                                v
visibility:visible;                         v:v
visibility:hidden;                          v:h
visibility:collapse;                        v:c
overflow:;                                  ov
overflow:visible;                           ov:v
overflow:hidden;                            ov:h
overflow:scroll;                            ov:s
overflow:auto;                              ov:a
overflow-x:;                                ovx
overflow-x:visible;                         ovx:v
overflow-x:hidden;                          ovx:h
overflow-x:scroll;                          ovx:s
overflow-x:auto;                            ovx:a
overflow-y:;                                ovy
overflow-y:visible;                         ovy:v
overflow-y:hidden;                          ovy:h
overflow-y:scroll;                          ovy:s
overflow-y:auto;                            ovy:a
overflow-style:;                            ovs
overflow-style:auto;                        ovs:a
overflow-style:scrollbar;                   ovs:s
overflow-style:panner;                      ovs:p
overflow-style:move;                        ovs:m
overflow-style:marquee;                     ovs:mq
zoom:1;                                     zoo
clip:;                                      cp
clip:auto;                                  cp:a
clip:rect(0000);                         cp:r
box-sizing:;                                bxz
box-sizing:content-box;                     bxz:cb
box-sizing:border-box;                      bxz:bb
box-shadow:;                                bxsh
box-shadow:none;                            bxsh:n
box-shadow:000#000;                      bxsh+
-webkit-box-shadow:;                        bxsh:w
-webkit-box-shadow:000#000;              bxsh:w+
-moz-box-shadow:;                           bxsh:m
-moz-box-shadow:0000#000;               bxsh:m+

Sizing

margin:;                                    m
margin:auto;                                m:a
margin:0;                                   m:0
margin:00;                                 m:2
margin:000;                               m:3
margin:0000;                             m:4
margin-top:;                                mt
margin-top:auto;                            mt:a
margin-right:;                              mr
margin-right:auto;                          mr:a
margin-bottom:;                             mb
margin-bottom:auto;                         mb:a
margin-left:;                               ml
margin-left:auto;                           ml:a
padding:;                                   p
padding:0;                                  p:0
padding:00;                                p:2
padding:000;                              p:3
padding:0000;                            p:4
padding-top:;                               pt
padding-right:;                             pr
padding-bottom:;                            pb
padding-left:;                              pl
width:;                                     w
width:auto;                                 w:a
height:;                                    h
height:auto;                                h:a
max-width:;                                 maw
max-width:none;                             maw:n
max-height:;                                mah
max-height:none;                            mah:n
min-width:;                                 miw
min-height:;                                mih

Color appearance

outline:;                                   o
outline:none;                               o:n
outline:1px solid #000;                     o+
outline-offset:;                            oo
outline-width:;                             ow
outline-style:;                             os
outline-color:#000;                         oc
outline-color:invert;                       oc:i
border:;                                    bd
border:none;                                bd:n
border:1px solid #000;                      bd+
border-break:;                              bdbk
border-break:close;                         bdbk:c
border-collapse:;                           bdcl
border-collapse:collapse;                   bdcl:c
border-collapse:separate;                   bdcl:s
border-color:#000;                          bdc
border-image:;                                          bdi
border-image:none;                                      bdi:n
border-image:url()0 repeat;                            bdi:+
-webkit-border-image:;                                  bdi:w
-webkit-border-image:url()0 repeat;                    bdi:w+
-moz-border-image:;                                     bdi:m
-moz-border-image:url()0 repeat;                       bdi:m+
border-top-image:;                          bdti
border-top-image:none;                      bdti:n
border-right-image:;                        bdri
border-right-image:none;                    bdri:n
border-bottom-image:;                       bdbi
border-bottom-image:none;                   bdbi:n
border-left-image:;                         bdli
border-left-image:none;                     bdli:n
border-corner-image:;                       bdci
border-corner-image:none;                   bdci:n
border-corner-image:continue;               bdci:c
border-top-left-image:;                     bdtli
border-top-left-image:none;                 bdtli:n
border-top-left-image:continue;             bdtli:c
border-top-right-image:;                    bdtri
border-top-right-image:none;                bdtri:n
border-top-right-image:continue;            bdtri:c
border-bottom-right-image:;                 bdbri
border-bottom-right-image:none;             bdbri:n
border-bottom-right-image:continue;         bdbri:c
border-bottom-left-image:;                  bdbli
border-bottom-left-image:none;              bdbli:n
border-bottom-left-image:continue;          bdbli:c
border-fit:;                                bdf
border-fit:clip;                            bdf:c
border-fit:repeat;                          bdf:r
border-fit:scale;                           bdf:sc
border-fit:stretch;                         bdf:st
border-fit:overwrite;                       bdf:ow
border-fit:overflow;                        bdf:of
border-fit:space;                           bdf:sp
border-length:;                             bdlt
border-length:auto;                         bdlt:a
border-spacing:;                            bdsp
border-style:;                              bds
border-style:none;                          bds:n
border-style:hidden;                        bds:h
border-style:dotted;                        bds:dt
border-style:dashed;                        bds:ds
border-style:solid;                         bds:s
border-style:double;                        bds:db
border-style:dot-dash;                      bds:dtds
border-style:dot-dot-dash;                  bds:dtdtds
border-style:wave;                          bds:w
border-style:groove;                        bds:g
border-style:ridge;                         bds:r
border-style:inset;                         bds:i
border-style:outset;                        bds:o
border-width:;                              bdw
border-top:;                                bdt
border-top:none;                            bdt:n
border-top:1px solid #000;                  bdt+
border-top-width:;                          bdtw
border-top-style:;                          bdts
border-top-style:none;                      bdts:n
border-top-color:#000;                      bdtc
border-right:;                              bdr
border-right:none;                          bdr:n
border-right:1px solid #000;                bdr+
border-right-width:;                        bdrw
border-right-style:;                        bdrs
border-right-style:none;                    bdrs:n
border-right-color:#000;                    bdrc
border-bottom:;                             bdb
border-bottom:none;                         bdb:n
border-bottom:1px solid #000;               bdb+
border-bottom-width:;                       bdbw
border-bottom-style:;                       bdbs
border-bottom-style:none;                   bdbs:n
border-bottom-color:#000;                   bdbc
border-left:;                               bdl
border-left:none;                           bdl:n
border-left:1px solid #000;                 bdl+
border-left-width:;                         bdlw
border-left-style:;                         bdls
border-left-style:none;                     bdls:n
border-left-color:#000;                     bdlc
border-radius:;                             bdrs
-webkit-border-radius:;                     bdrs:w
-moz-border-radius:;                        bdrs:m
border-top-right-radius:;                   bdtrrs
border-top-left-radius:;                    bdtlrs
border-bottom-right-radius:;                bdbrrs
border-bottom-left-radius:;                 bdblrs
background:;                                                                               bg
background:none;                                                                           bg:n
background:#FFF url() 0 0 no-repeat;                                                       bg+
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='',sizingMethod='crop');     bg:ie
background-color:#FFF;                      bgc
background-color:transparent;               bgc:t
background-image:url();                     bgi
background-image:none;                      bgi:n
background-repeat:;                         bgr
background-repeat:repeat;                   bgr:r
background-repeat:repeat-x;                 bgr:x
background-repeat:repeat-y;                 bgr:y
background-repeat:no-repeat;                bgr:n
background-attachment:;                     bga
background-attachment:fixed;                bga:f
background-attachment:scroll;               bga:s
background-position:00;                    bgp
background-position-x:;                     bgpx
background-position-y:;                     bgpy
background-break:;                          bgbk
background-break:bounding-box;              bgbk:bb
background-break:each-box;                  bgbk:eb
background-break:continuous;                bgbk:c
background-clip:;                           bgcp
background-clip:border-box;                 bgcp:bb
background-clip:padding-box;                bgcp:pb
background-clip:content-box;                bgcp:cb
background-clip:no-clip;                    bgcp:nc
background-origin:;                         bgo
background-origin:padding-box;              bgo:pb
background-origin:border-box;               bgo:bb
background-origin:content-box;              bgo:cb
background-size:;                           bgz
background-size:auto;                       bgz:a
background-size:contain;                    bgz:ct
background-size:cover;                      bgz:cv
color:#000;                                 c

Special content types

table-layout:;                              tbl
table-layout:auto;                          tbl:a
table-layout:fixed;                         tbl:f
caption-side:;                              cps
caption-side:top;                           cps:t
caption-side:bottom;                        cps:b
empty-cells:;                               ec
empty-cells:show;                           ec:s
empty-cells:hide;                           ec:h
list-style:;                                lis
list-style:none;                            lis:n
list-style-position:;                       lisp
list-style-position:inside;                 lisp:i
list-style-position:outside;                lisp:o
list-style-type:;                           list
list-style-type:none;                       list:n
list-style-type:disc;                       list:d
list-style-type:circle;                     list:c
list-style-type:square;                     list:s
list-style-type:decimal;                    list:dc
list-style-type:decimal-leading-zero;       list:dclz
list-style-type:lower-roman;                list:lr
list-style-type:upper-roman;                list:ur
list-style-image:;                          lisi
list-style-image:none;                      lisi:n
quotes:;                                    q
quotes:none;                                q:n
quotes:'\00AB''\00BB''\201E''\201C';     q:ru
quotes:'\201C''\201D''\2018''\2019';     q:en
content:;                                   ct
content:normal;                             ct:n
content:open-quote;                         ct:oq
content:no-open-quote;                      ct:noq
content:close-quote;                        ct:cq
content:no-close-quote;                     ct:ncq
content:attr();                             ct:a
content:counter();                          ct:c
content:counters();                         ct:cs
counter-increment:;                         coi
counter-reset:;                             cor

Text

vertical-align:;                            va
vertical-align:super;                       va:sup
vertical-align:top;                         va:t
vertical-align:text-top;                    va:tt
vertical-align:middle;                      va:m
vertical-align:baseline;                    va:bl
vertical-align:bottom;                      va:b
vertical-align:text-bottom;                 va:tb
vertical-align:sub;                         va:sub
text-align:;                                ta
text-align:left;                            ta:l
text-align:center;                          ta:c
text-align:right;                           ta:r
text-align:justify;                         ta:j
text-align-last:;                           tal
text-align-last:auto;                       tal:a
text-align-last:left;                       tal:l
text-align-last:center;                     tal:c
text-align-last:right;                      tal:r
text-decoration:;                           td
text-decoration:none;                       td:n
text-decoration:overline;                   td:o
text-decoration:line-through;               td:l
text-decoration:underline;                  td:u
text-emphasis:;                             te
text-emphasis:none;                         te:n
text-emphasis:accent;                       te:ac
text-emphasis:dot;                          te:dt
text-emphasis:circle;                       te:c
text-emphasis:disc;                         te:ds
text-emphasis:before;                       te:b
text-emphasis:after;                        te:a
text-height:;                               th
text-height:auto;                           th:a
text-height:font-size;                      th:f
text-height:text-size;                      th:t
text-height:max-size;                       th:m
text-indent:;                               ti
text-indent:-9999px;                        ti:-
text-justify:;                              tj
text-justify:auto;                          tj:a
text-justify:inter-word;                    tj:iw
text-justify:inter-ideograph;               tj:ii
text-justify:inter-cluster;                 tj:ic
text-justify:distribute;                    tj:d
text-justify:kashida;                       tj:k
text-justify:tibetan;                       tj:t
text-outline:;                              to
text-outline:none;                          to:n
text-outline:00#000;                      to+
text-replace:;                              tr
text-replace:none;                          tr:n
text-transform:;                            tt
text-transform:none;                        tt:n
text-transform:uppercase;                   tt:u
text-transform:capitalize;                  tt:c
text-transform:lowercase;                   tt:l
text-wrap:;                                 tw
text-wrap:normal;                           tw:n
text-wrap:none;                             tw:no
text-wrap:unrestricted;                     tw:u
text-wrap:suppress;                         tw:s
text-shadow:;                               tsh
text-shadow:none;                           tsh:n
text-shadow:000#000;                     tsh+
line-height:;                               lh
white-space:;                               whs
white-space:normal;                         whs:n
white-space:pre;                            whs:p
white-space:nowrap;                         whs:nw
white-space:pre-wrap;                       whs:pw
white-space:pre-line;                       whs:pl
white-space-collapse:;                      whsc
white-space-collapse:normal;                whsc:n
white-space-collapse:keep-all;              whsc:k
white-space-collapse:loose;                 whsc:l
white-space-collapse:break-strict;          whsc:bs
white-space-collapse:break-all;             whsc:ba
word-break:;                                wob
word-break:normal;                          wob:n
word-break:keep-all;                        wob:k
word-break:loose;                           wob:l
word-break:break-strict;                    wob:bs
word-break:break-all;                       wob:ba
word-spacing:;                              wos
word-wrap:;                                 wow
word-wrap:normal;                           wow:n
word-wrap:none;                             wow:no
word-wrap:unrestricted;                     wow:u
word-wrap:suppress;                         wow:s
letter-spacing:;                            lts
font:;                                      f
font:1emArial,sans-serif;                  f+
font-weight:;                               fw
font-weight:normal;                         fw:n
font-weight:bold;                           fw:b
font-weight:bolder;                         fw:br
font-weight:lighter;                        fw:lr
font-style:;                                fs
font-style:normal;                          fs:n
font-style:italic;                          fs:i
font-style:oblique;                         fs:o
font-variant:;                              fv
font-variant:normal;                        fv:n
font-variant:small-caps;                    fv:sc
font-size:;                                 fz
font-size-adjust:;                          fza
font-size-adjust:none;                      fza:n
font-family:;                                               ff
font-family:Georgia,'Times New Roman',serif;              ff:s
font-family:Helvetica,Arial,sans-serif;                     ff:ss
font-family:'Monotype Corsiva','Comic Sans MS',cursive;     ff:c
font-family:Capitals,Impact,fantasy;                        ff:f
font-family:Monaco,'Courier New',monospace;                 ff:m
font-effect:;                               fef
font-effect:none;                           fef:n
font-effect:engrave;                        fef:eg
font-effect:emboss;                         fef:eb
font-effect:outline;                        fef:o
font-emphasize:;                            fem
font-emphasize-position:;                   femp
font-emphasize-position:before;             femp:b
font-emphasize-position:after;              femp:a
font-emphasize-style:;                      fems
font-emphasize-style:none;                  fems:n
font-emphasize-style:accent;                fems:ac
font-emphasize-style:dot;                   fems:dt
font-emphasize-style:circle;                fems:c
font-emphasize-style:disc;                  fems:ds
font-smooth:;                               fsm
font-smooth:auto;                           fsm:a
font-smooth:never;                          fsm:n
font-smooth:always;                         fsm:aw
font-stretch:;                              fst
font-stretch:normal;                        fst:n
font-stretch:ultra-condensed;               fst:uc
font-stretch:extra-condensed;               fst:ec
font-stretch:condensed;                     fst:c
font-stretch:semi-condensed;                fst:sc
font-stretch:semi-expanded;                 fst:se
font-stretch:expanded;                      fst:e
font-stretch:extra-expanded;                fst:ee
font-stretch:ultra-expanded;                fst:ue

Visual properties

opacity:;                                                               op
filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100);            op:ie
-ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)';      op:ms
resize:;                                    rz
resize:none;                                rz:n
resize:both;                                rz:b
resize:horizontal;                          rz:h
resize:vertical;                            rz:v
cursor:;                                    cur
cursor:auto;                                cur:a
cursor:default;                             cur:d
cursor:crosshair;                           cur:c
cursor:hand;                                cur:ha
cursor:help;                                cur:he
cursor:move;                                cur:m
cursor:pointer;                             cur:p
cursor:text;                                cur:t

Print

page-break-before:;                         pgbb
page-break-before:auto;                     pgbb:a
page-break-before:always;                   pgbb:aw
page-break-before:left;                     pgbb:l
page-break-before:right;                    pgbb:r
page-break-inside:;                         pgbi
page-break-inside:auto;                     pgbi:a
page-break-inside:avoid;                    pgbi:av
page-break-after:;                          pgba
page-break-after:auto;                      pgba:a
page-break-after:always;                    pgba:aw
page-break-after:left;                      pgba:l
page-break-after:right;                     pgba:r
orphans:;                                   orp
widows:;                                    wid

原链接:https://code.google.com/p/zen-coding/wiki/ZenCSSPropertiesEn

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏前端儿

编写高质量 JavaScript -- 知识点小记

此番改善之后,匿名function里面的变量作用域不再是window,而是局限在函数内。

1981
来自专栏好好学java的技术栈

特别的520,送给特别的你们,还不来看看?

1222
来自专栏编程

第1章:初识编程

写在前面 之前答应过不少朋友今年要写个《猫哥极简编程入门》的系列,帮助各位对编程感兴趣的新人和非程序员,快速掌握一些实用的编程技巧,以便快速入门编程以及应付一些...

22810
来自专栏林德熙的博客

win10 uwp 分治法

算法涉及到了一个平面几何的知识。就是三角形p1p2p3的面积等于以下行列式的二分之一: % <![CDATA[ \begin{array}{cccc} | ...

831
来自专栏mathor

事件模型

 事件模型如何理解呢,举个例子,你老婆出门了,让你在家看孩子,难道你每过一分钟就去看一次孩子吗,对于计算机来说,我做一个按钮,难道就一直监听这个按钮使用没有...

971
来自专栏阿凯的Excel

自定义单元格格式介绍(第二期 文本版)

上期和大家分享了自定义条件格式的数字版。本期继续和大家分享文本的自定义单元格格式! 继续强调啰嗦两件事情!!! 1、自定义单元格格式只改变显示内容,不改变实...

2956
来自专栏数据科学学习手札

(数据科学学习手札42)folium进阶内容介绍

  在上一篇(数据科学学习手札41)中我们了解了folium的基础内容,实际上folium在地理信息可视化上的真正过人之处在于其绘制图像的高度可定制化上,本文就...

3184
来自专栏Java帮帮-微信公众号-技术文章全总结

CSS Selectors Level 4新特性全面解析

前言 当看到 CSS Selectors Level 4 很多人会理所当然地喊出 CSS4。但是,这里必须明确一个概念,目前所谓的 CSS3 和 CSS4 都是...

3217
来自专栏小灰灰

cocos2dx-v3.4 2048(四):游戏逻辑的设计与实现

前言 ---- 2048的游戏逻辑比较简单,向四个方向移动单元格,若相邻的单元格数字相同,则合并成一个新的单元格,且数字为之前的两倍;若不同,则移动到目的方向上...

4016
来自专栏hrscy

Unity - 在鼠标点击的位置放置对象

你可以使用函数实例化多个给定的游戏对象或预制对象。 Instantiate (Object Target, object’s position, object...

4202

扫码关注云+社区

领取腾讯云代金券