emmet的html和css使用技巧大全
emmet html使用技巧大全
! 初始化
>：后代
+：兄弟
^：向上
*：乘法
$：数字
()：分组
#：id命名
.：类命名
一、id，类命名
p#info
p.info
a[href=#]
二、后代：
div#wrap>ul>li*10
三、兄弟：
div#wrap>p.one + span.two
四、向上提升一行：^
ul>li*10^ol>li*6
五、数字缩写：$
ul>li.item$*3
六、多个数量：*
ul>li.item$*3
七、分组：()
(div.foo>h1>p)+(div.bar>h3>p)
####################
emmet css使用技巧大全
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;