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;
emmet的html和css使用技巧大全
,温馨提示: 本文由Jm博客推荐,转载请保留链接: https://www.jmwww.net/file/web/40498.html
- 上一篇:jQuery同时添加或移除多个class类名
- 下一篇:css3新样式