Emmet常用的缩写

标签：

Emmet的前身是Zen coding,它使用缩写,来提高html/css的编写速度。尤其是据说所有的css样式都有缩写，下面我总结了对于个人来说经常使用的html标签和css样式的缩写，完整的请参考

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

一、HTML   

     1.  link:css       -- 快捷引入外部css文件

     2.  cc:ie           -- 编写在ie情况下

     3.  script:src    -- 快捷引入外部js文件

     4.  h1{text}    -- <h1>text</h1>

     5.  a[href=#]   -- <a href="#"></a>

     6. ul>li.item$*3 --

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

     7.  a.link{click} -- <a href="" class="link">click</a>

     8.  input:button.btn -- <input type="button" class="btn">

二、CSS（个人认为比html更有用）

    1.  w100           -- width:100px;

    2.  h5p             -- height:5%;

    3.  oh / ovh /ov-h       -- overflow:hidden;
         zm1                     -- zoom:1;

    4.  o0               -- opacity:0;
         op+             -- opacity: ;
                               filter: alpha(opacity=);
         op:ie           -- -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
                               filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);

    5.  db               -- display:block;
         dib              -- display:inline-block;

    6.  trf               -- transform各种兼容
         trf:sc           -- transform:scale();
         trs               -- transition
         bdrs             -- border-radius及各种前缀
         bxsh            -- box-shadow

    7.  bdb             -- border-bottom
         bdt             -- border-top
         bdl              -- border-left
         bdr             -- border-right

    8.  fz                -- font-size
         fw               -- font-weight
         fw400          -- font-weight:400;
         ff                 -- font-family

    9. m-10-2-0-12        -- margin:10px 2px 0 12px;

   10.  c#0            -- color:#000;
          cra             -- color: rgba(0,0,0.5);

   11.  bd1-s-red    -- border:1px solid red;
          bd+            -- border: 1px solid #000;
          bdb+          -- border-bottom: 1px solid #000;

   12.  m0-auto-0        -- margin:0 auto 0;

   13.  lh1.6                -- line-height:1.6;
         vam                  -- vertical-align:middle;
         tac                    -- text-align: center;
         td                     -- text-decoration:none;
         tdu                   -- text-decoration:underline;
         ti                      -- text-indent

  14.  z10                     -- z-index:10;

  15.  bg                      -- background
         bgc                    -- background-color
         bgsz:cv               -- background-size:cover;
         bg+                    -- background:#fff url() 0 0 no-repeat;

  16.  pos: a                  -- position:absolute;
         pos: r                  -- position: relative;
         pos: f                  -- position: fixed;

  17.  fl                         -- float:left;
         fr                        -- float:right;

  18.  curp                    -- cursor: pointer;

暂时写这么多，以后若还有的话，再补充~

Emmet常用的缩写

标签：

原文地址：http://www.cnblogs.com/sapho/p/5623262.html