インプレス ビジネスメディア
Web担トップ » HTML+CSSコーディングが10倍速くなるZen Coding » HTMLでよく使うタグをZen Codingで入力する | Zen Coding 3-3: Page 6 of 6
HTML+CSSコーディングが10倍速くなるZen Coding

Zen Codingでリンクを作成する

ページ

Zen Codingでリンクを作成する

ほかのページやサイトへ移動するためのリンクも、Webページによく入れるもののひとつです。

HTMLでは、「<a href="リンク先のURI"></a>」と記述します。

Zen Codingでは、aタグの省略形は「a」となっています。

省略形「a」を入力して展開すると「<a href=""></a>」となるので、href属性にリンク先のURI、aタグの開始タグと終了タグの間にリンクテキストを入力します。

  1. 省略形の入力

    省略形「a」を入力する。

    省略形の入力
  2. 省略形の展開

    ショートカットキーで展開する。

  3. コードが展開された

    「a」が「<a href=""></a>」と展開されている。

    コードが展開された
  4. リンクの内容の入力

    「"」と「"」の間にリンク先URI、<a href="">と</a>の間にリンクテキストを入力する。

    <p><a href="continue.html">続きを読む</a></p>
    リンクの内容の入力
HTML+CSSコーディングが10倍速くなるZen Coding
  • HTML+CSSコーディングが10倍速くなるZen Coding
  • こもり　まさあき・岡部 和昌 著
  • ISBNコード
    978-4-8443-2945-9
  • インプレス
この本をAmazonで注文する

この記事は、書籍『HTML+CSSコーディングが10倍速くなるZen Coding』の内容の一部を、Web担向けに特別にオンラインで公開しているものです。

ネットで話題の"究極の超速コーディング"がだれでもマスターできる！

めんどうなタグ入力も、一瞬でラクラク変換！ Zen Codingを使えば、かんたんな「省略形」だけでHTML/CSSタグがどんどん入力でき、複雑なHTML/CSSも、あっという間にコーディング可能です！同じタグの繰り返しや入れ子構造、連番も一発で自動変換。Webページ制作が画期的にスピードアップできます。 日々大量のタグを打つWebデザイナー、マークアップエンジニア、サイト更新担当者らが泣いて喜ぶマジックツール、Zen Codingのはじめての解説書です。

ページ

この記事が役に立ったらシェア!
関連記事: 
これは広告です
メルマガの登録はこちら　Web担当者に役立つ情報をサクッとゲット！
この記事の筆者

こもりまさあき（cipher）
フリーランス

1972年生まれ。黎明期からWebサイト構築などに関わる。現在はWeb関連業務に加えてテクニカルライティング、講師など、業種を限定せずに活動しながら、Twitter（@cipher）でたまに毒を吐く日々。 近著に『HTML+CSS コーディングベストプラクティス』（MdN・共著）など。
gaspanik weblog　http://blog.gaspanik.com/
ソーシャル系のアカウント一覧はこちら　http://eee.am/cipher

岡部和昌（おかべ・かずまさ）
Webデザイナー

1983年生まれ、埼玉県の田舎出身。大学で応用化学を学んだ後、ヤフー株式会社初のデザイナー新卒採用にて入社。現在に至る。同社サイトの大規模リニューアルのマークアップを数多くメインで担当した経験を持つ。 ページ表示速度の高速化、マークアップの効率化に強い関心があり、HTML5やCSS3を用いたサイトの開発・運用、Java ScriptやPHPを用いた動的なサイト構築が得意分野。 執筆記事に『続・ハイパフォーマンスWebサイト−ウェブ高速化のベストプラクティス』（オライリージャパン）付録「Yahoo! JAPANが実践するWebの高速化」（共著）。
kzms2 - html,css,javascript　http://kzms2.com/
Twitter　@kzms2

これは広告です
メルマガの登録はこちら　Web担当者に役立つ情報をサクッとゲット！

人気記事トップ10（過去7日間）

  1. 管理職において「等級ステージ」と「部下を知る努力」は反比例することが判明【ALL DIFFERENT調べ】
  2. 【計算できる？】鍵穴3つ、鍵12本、3つの鍵穴に正しい鍵が同時にセットされないと開かない。最大試行回数は？
  3. カスハラの男女年代別「被害者／加害者」で傾向クッキリ。被害に遭いやすいのは誰？【インターワイヤード調べ】
  4. Xを運用して3ヶ月。いいねもほとんどつかず、反応もとれません。どうすればいいでしょうか？
  5. それガーチャー？令和ギャルが選ぶ「egg流行語大賞2024」TOP10を発表【エイチジェイ調べ】
  6. 今冬のボーナスの使い道、「貯金・預金」が11年連続トップながら過去最低の割合に【Pontaリサーチ調べ】
  7. 丸亀製麺の勝ち続ける戦略とは？ MMMを採用して感性をデータで測り、マーケティングの勝率を高める！
  8. YouTubeで「ふだん見ない」ジャンル、「迷惑系」を上回ったちょっと意外な1位は？【ナビット調べ】
  9. ノーコード型「Excel」業務効率化支援ツール「楽々Webデータベース」の最新版を提供
  10. サンリオ流アクセス解析！ BigQueryなしでも実現、GA4でPDCAの回し方

今日の用語

Webアプリケーション
Webアプリケーションは、一般にオンラインで作動するアプリケーションを指す。 ...→用語集へ

インフォメーション

RSSフィード

Web担を応援して支えてくださっている企業さま [各サービス/製品の紹介はこちらから]

[SPONSOR]
株式会社日本レジストリサービス株式会社キノトロープSitecore株式会社ミツエーリンクス株式会社電通デジタル株式会社サイズプライム・ストラテジー株式会社