画像(Images)

マークダウン記法でリンクが作れるなら、画像も作れます。 書き方はほとんど同じです。

画像もリンクと同じように二通りの方法がありますが、どちらも出力結果は同じです。 画像はリンクと異なり、感嘆符( ! )が前につきます。

一つ目の方法は、インライン画像リンクと呼ばれます。インライン画像リンクを作るには、 感嘆符( ! )のあとにalt属性(代替テキスト)をブラケット( [ ] )で囲み、 参照先をカッコ内に( ( ) )書きます。(Alt属性は画像の説明をするための文章です)

例えば、https://octodex.github.com/images/bannekat.pngへのインライン画像リンクを「Benjamin Bannekat」 というAlt属性をつけて作るには、このように書きます。 ![Benjamin Bannekat](https://octodex.github.com/images/bannekat.png)

この問題では、リンクを画像にしてみてください。また、ブラケットの中にAlt属性を「A pretty tiger」 となるように書いてください。


すごい!

Alt属性は必須ではありませんが、コンテンツをより幅広い人々、例えば 視覚障がい者や、スクリーンリーダーを使う人、インターネットが遅い人などに届けることができます。

参照画像は参照リンクと同じように作れます。まずは感嘆符ではじめ、Alt属性をブラケットで囲み、 さらに画像タグ用にブラケットを用意し、![The founding father][Father]のように書きます。 そしてマークダウン文書の最後にタグ用の画像を次のように定義します。[Father]: http://octodex.github.com/images/founding-father.jpg

この問題では、参照画像をいくつか用意しました。前回の問題と同じようにこれらを完成させることが目標です。 最初の参照タグを「Black」で作成し、https://upload.wikimedia.org/wikipedia/commons/a/a3/81_INF_DIV_SSI.jpgへのリンクを作成してください。 そして二つ目は、http://icons.iconarchive.com/icons/google/noto-emoji-animals-nature/256/22221-cat-icon.pngへのリンクとしてください。


やりましたね!マークダウンで画像を表示させる方法を一通り覚えました!

さぁ、次のレッッスンにいきましょう!