http://frontended.blogspot.com/search/label/html

Search

2014年10月13日 星期一

Zencoding Tips

  • u1>li + Tab 
<ul>
<li></li>
</ul>
  • ul>li*5 +Tab
  <ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
  </ul>
  • ul#menu>li*3 +Tab
<ul id="menu">
  <li></li>
  <li></li>
  <li></li>
</ul>
  • ul#menu>li*4>lorem3 +Tab
<ul id="menu">
  <li>Lorem ipsum dolor.</li>
  <li>Nisi possimus, amet.</li>
  <li>Eos, asperiores, neque.</li>
  <li>Quae, illum, autem.</li>
</ul>
  • ul#menu>li.item*3>lorem5 +Tab
<ul id="menu">
  <li class="item">Lorem ipsum dolor sit amet.</li>
  <li class="item">Quam, commodi ut perferendis laudantium!</li>
  <li class="item">Voluptatum, delectus nesciunt quia. Illo?</li>
</ul>
  • ul#menu>li.item[title]*3>lorem5 +Tab
<ul id="menu">
  <li class="item" title="">Lorem ipsum dolor sit amet.</li>
  <li class="item" title="">Ipsum tempore est ipsam omnis.</li>
  <li class="item" title="">Ullam dicta, aliquid! Architecto, omnis.</li>
</ul>
  • ul#menu>li.item[title]*3>a>lorem1 +Tab
<ul id="menu">
  <li class="item" title=""><a href="">Lorem.</a></li>
  <li class="item" title=""><a href="">Earum.</a></li>
  <li class="item" title=""><a href="">Quod.</a></li>
</ul>
  • ul#menu>li.item[title]*3>a{連結到 Link $$} +Tab
<ul id="menu">
  <li class="item" title=""><a href="">連結到 Link 01</a></li>
  <li class="item" title=""><a href="">連結到 Link 02</a></li>
  <li class="item" title=""><a href="">連結到 Link 03</a></li>
</ul>


view more:
Back to Top
Powered by ProofFactor - Social Proof Notifications