emmet

语法

  • 嵌套(>)
    div>ul>li
<div>
  <ul>
    <li></li>
  </ul>
</div>
  • 并列(+)
    div+p+span
<div></div>
<p></p>
<span></span>
  • 上层(^)
    div+div>p>span+em^p: ^可重复使用
<div></div>
<div>
  <p><span></span><em></em></p>
  <p></p>
</div>
  • 乘法
    p*5
  • 分组
    div>(header>ul>li*2>a)+footer>p
  • 内容
    div{hello}
  • ID和Clas
    p#text1>p.text2
  • 自定义属性
    div[title="Hello" colspan=3]
  • 编号(\() `ul>li.item\)5 ul>li.item$$\(*5`: 格式(001) `ul>li.item\)@-5: 降序 ul>li.item$@3*5`: 从3开始

css

  • 简写
    w10>width:10px
    fl>float:left
    lh10>line-hight:10
  • 单位
    p>%,e>em,x>ex
  • 颜色
    #1>#111111,#e0>#e0e0e0,#fc0>#fc0fc0
  • 渐变
    lg(left, #fc0 30%, red)
background-image: -webkit-linear-gradient(left, #fco 30%, red);
background-image: -moz-linear-gradient(left, #fco 30%, red);
background-image: -o-linear-gradient(left, #fco 30%, red);
background-image: linear-gradient(to right, #fco 30%, red);

border: lg(left, #fc0 30%, red)

  • 透明
    -wm-trf
    -wm-trf[数字]
  • 圆角
    -bdrs
    -bdrs[数字]
posted @ 2023-02-26 16:25  小尛M0  阅读(61)  评论(0)    收藏  举报