タグ

zen-codingに関するpefusanのブックマーク (2)

  • Zen Codingでできる、あんなことこんなこと | Zen Coding 1-2 | HTML+CSSコーディングが10倍速くなるZen Coding

    HTMLタグをいちいち手で入力していると、時間もかかりますし、入力間違いやスペルミスなど、間違いの原因にもなります。それはCSSでも同じです。 DreamweaverなどのWebオーサリングツールには、標準でタグや属性の補完機能や「スニペット」といわれる入力支援機能があります。スニペットは、登録されているよく使うコードを呼び出して、コピー&ペーストの要領で入力します。 Zen Codingでは、このスニペットのようによく使うコードを呼び出して入力するものですが、「省略形」(abbreviation)といわれるコードの略語のようなものを入力するだけで、さらにかんたんにコードを入力することができます。 Zen Codingを使えばコーディングはこう変わる!HTMLコーディングでは、「<h1>見出しタイトル</h1>」のようにテキストを開始タグと終了タグで囲み、見出しを指定します。 Zen Co

    Zen Codingでできる、あんなことこんなこと | Zen Coding 1-2 | HTML+CSSコーディングが10倍速くなるZen Coding
  • マークアップ効率化 - zen-codingでコーディングを倍速に

    HTMLの記法について 基的には「div」の様に要素を省略せずに記述して、それを展開すると「<div></div>」という形に展開されます。 このときに展開できる要素は以下の公式ドキュメントに明記されていますのでそちらを見るとよいです。 Zen HTML Elements Zen HTML Selectors Zen CheatSheets 基的な記法 ひとつずつ順番に記述して説明していきます。しばらく初歩的な説明になるのである程度知っている方は飛ばしていただいて良いかと思います。 まずものすごく基的な記法である、単独タグの記法について説明を行います。 cssのセレクタをイメージしながら見ていくと納得しやすいと思います。 タグだけ変換 変換前 div 変換後 <div></div> デモ 文末でtabを押してください div 変換後、div要素の間にカーソルが移動するので、すぐにテキ

    マークアップ効率化 - zen-codingでコーディングを倍速に
  • 1