# 아래 링크는 들어가서 확인해볼것

https://code.google.com/p/zen-coding/

https://code.google.com/p/zen-coding/wiki/ZenHTMLSelectorsEn

https://code.google.com/p/zen-coding/downloads/detail?name=ZenCodingCheatSheet.pdf

http://www.aether.ru/files/zencoding.pdf

http://docs.emmet.io/



Zen HTML Selectors

E#name

div#name

<div id="name"></div>

E.name

div.name

<div class="name"></div>

div.one.two

<div class="one two"></div>

div#name.one.two

<div id="name" class="one two"></div>

E>E

head>link

<head>
   
<link/>
</head>

table>tr>td

<table>
<tr>
   
<td></td>
</tr>
</table>

ul#name>li.item

<ul id="name">
   
<li class="item"></li>
</ul>

E+E

p+p

<p></p>
<p></p>

div#name>p.one+p.two

<div id="name">
   
<p class="one"></p>
   
<p class="two"></p>
</div>

E[attr]

Added in v0.6

p[title]

<p title=""></p>

td[colspan=2]

<td colspan="2"></td>

span[title="Hello" rel]

<span title="Hello" rel=""></span>

E|filter

Added in v0.6

p.title|e

&lt;p class="title"&gt;&lt;/p&gt;

Read Filters for more info

E*N

p*3

<p></p>
<p></p>
<p></p>

ul#name>li.item*3

<ul id="name">
   
<li class="item"></li>
   
<li class="item"></li>
   
<li class="item"></li>
</ul>

E*N$

p.name-$*3

<p class="name-1"></p>
<p class="name-2"></p>
<p class="name-3"></p>

select>option#item-$*3

<select>
   
<option id="item-1"></option>
   
<option id="item-2"></option>
   
<option id="item-3"></option>
</select>

E+

ul+

<ul>
   
<li></li>
</ul>

table+

<table>
<tr>
   
<td></td>
</tr>
</table>

dl+

<dl>
   
<dt></dt>
   
<dd></dd>
</dl>

'Interesting > TIPTECH' 카테고리의 다른 글

Google Play 앱 환불  (3) 2013.06.12
Gmail 4.5 삭제 버튼 만들기  (0) 2013.06.07
Zen Coding 문법정리  (0) 2013.05.24
Google OTP 설치  (0) 2013.05.06
백업 코드를 사용하여 로그인하기  (0) 2013.05.06
Google 계정에 대한 비밀번호 복구 옵션  (0) 2013.05.06

+ Recent posts