かずきのBlog@hatena

日本マイクロソフトに勤めています。XAML + C#の組み合わせをメインに、たまにASP.NETやJavaなどの.NET系以外のことも書いています。掲載内容は個人の見解であり、所属する企業を代表するものではありません。

ZenCoding個人的によく使うと思われる記述のメモ

書き方

とりあえず一覧は公式のWikiを見るとして、よく使うものだけをメモ。

書き方 展開後 説明
a>b <a><b></b></a> aタグの子にbタグを入れる
a+b <a></a><b></b> aタグに続けてbタグ
a.b <a class="b"></a> aタグにbといclassをつける
a#b <a id="b"></a> aタグにbというidをつける
a[hoge="moge" foo="bar"] <a hoge="moge" foo="bar"></a> aタグにhoge="moge" foo="bar"という属性をつける
a*3 <a></a><a></a><a></a> aタグを3つ

応用

書き方で紹介してるものは下のように組み合わせて作れる。これが強力。

  • 繋げる
    • a>b>c
    • a#hoge.moge.foo[nn="aa"]
  • 括弧でくくれる
    • (div.hoge>ul>li*3)*2