• 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

  • 相关阅读:
    vue小结
    ES6中的super关键字
    es5和es6
    雅虎工程师提供的CSS初始化示例代码
    移动端rem用法总结
    批量压缩图片
    cordova
    cordova 添加插件时报错相关问题
    JS 数组中对象去重 reduce 用法
    中间件笔录
  • 原文地址:https://www.cnblogs.com/cssfirefly/p/2958137.html
Copyright © 2020-2023  润新知