EMMET指令 - dreamline2/Front_End_Exchange GitHub Wiki
http://docs.emmet.io/cheat-sheet/ 參考網站 因為時常忘記 來做這邊做個紀錄 20131204
- nav>ul>li
<nav>
<ul>
<li></li>
</ul>
</nav>
- div+p+bq
<div></div>
<p></p>
<blockquote></blockquote>
- div+div>p>span+em^bq
<div></div>
<div>
<p><span></span><em></em></p>
<blockquote></blockquote>
</div>
- div+div>pspan+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>
我現在大多數的用法 不適合用在zen-coding
###利用CLASSID直接變成DIV
#header
<div id="header"></div>
.title
<div class="title"></div>
form#search.wide
<form id="search" class="wide"></form>
p.class1.class2.class3
<p class="class1 class2 class3"></p>
a
<a href=""></a>
a:link
<a href="http://"></a>
- html:5
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
</head>
<body>
</body>
</html>
- html4
- **html:4t
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title>Document</title>
</head>
<body>
</body>
</html>
- html:xt
Alias of !!!xt+doc4[xmlns=http://www.w3.org/1999/xhtml xml:lang=${lang}]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title>Document</title>
</head>
<body>
</body>
</html>
- 基本大多數我會用到的
###position
pos:s
position:static;
pos:a
position:absolute;
pos:r
position:relative;
pos:f
position:fixed;
###width,height
w
width:;
w:a
width:auto;
h
height:;
h:a
height:auto;
maw
max-width:;
maw:n
max-width:none;
mah
max-height:;
mah:n
max-height:none;
miw
min-width:;
mih
min-height:;
###margin padding
Margin & Padding
m
margin:;
m:a
margin:auto;
mt
margin-top:;
mt:a
margin-top:auto;
mr
margin-right:;
mr:a
margin-right:auto;
mb
margin-bottom:;
mb:a
margin-bottom:auto;
ml
margin-left:;
ml:a
margin-left:auto;
p
padding:;
pt
padding-top:;
pr
padding-right:;
pb
padding-bottom:;
pl
padding-left:;