pタグで囲われた部分は段落となり、段落同士の間には隙間が入っているのがわかります。あざらしどんな文章も基本はpタグを使って表すので、すごいよく使うタグだよ改行を作るタグ文章を改行するには<br>タグを使います。最初のうちは戸惑いやすいのですが、HTMLファイルのなかで文章を改行しても、ブラウザ表示上は改行されません。HTMLファイル内での改行は全て無視されるという仕様になっているからです。改行したいときどうするのかというと、<br>タグを使うことで改行することができます。改行されませんこれは改行されますこれは改行されますこれは改行されますくまほんとだ!brのとこで改行してるなあざらしそうなんだ!最初は違和感を覚えるところかもしれないけど慣れていこう!brタグには閉じタグが必要ない!ちなみにbrタグには挟むコンテンツがありません。このような中身のない要素を空要素と呼びます。空要素は挟むコンテンツがないので終了タグを書く必要がありません。リンクを作るタグリンクとはHTMLファイルの大きな特徴の一つで、クリックすることで別のファイルに移動できる仕組みです。リンクを作るにはaタグを使って下記のように書きます。href="URL">表示する文章</a>aタグは<a>~</a>で囲まれているテキストに対して、リンクを設定します。リンク先はaタグの中にhref属性を使ってパスを指定します。Yahooに移動するリンクを作りたい場合は下記のように書きます。href="yahoo.co.jp">yahooを見る</a>yahooを見るクリックするとyahooが開くことがわかります。属性とは?aタグの中に、「href=”yahoo.co.jp”」という、href属性というものが出てきました。属性というのはタグに情報を持たせるためのもので、いろんな種類があります。今後もいろんなところで属性が出てくるので、「タグには属性が付けられる」ということを覚えて置きましょうあざらしhref属性にパスを指定することで、そのページにリンクさせることができるんだねちなみにリンク先のパスの指定方法には絶対指定や相対指定という方法があります。これらについては下記の記事で詳しく解説しています。参考記事パスの指定方法について画像を表示するタグ画像を表示するにはimgタグを使います。alt="画像の説文">imgタグの中には、画像の場所を示すsrc属性と、画像の説明文を示すalt属性などを設定します。下記のように書きます。画像がどこにあるのかを示す画像のパスを書きます。パスの指定の仕方はいくつかありますが、今回は絶対パスと言われる方法で指定します。src="https://wunderstand.net/wp-content/uploads/2019/01/character_pengin.png"上記のように画像ファイルのパスを指定することで、画像が表示されます。ちなみに画像ファイルは自分のサーバーのものでなくても、パスさえわかれば表示することができます。ちなみにパスの指定方法には絶対指定や相対指定という方法があります。これらについては下記の記事で詳しく解説しています。画像の代替となるテキストを書きます。画像が何らかの理由で表示できない場合にalt属性が表示されたり、読み上げ機能のあるブラウザでは画像のalt属性を読み上げます。alt属性には、画像が表示されない場合に、画像の内容が正しく理解されるようなテキストを記述します。googleのクローラーもalt属性を参照してどんな画像かを解析しています。画像検索などで検索したときの結果に影響すると言われていますので、しっかりと記述するようにしましょう。alt属性は下記のように記述します。alt="ペンギンの画像">例えば、わざと画像のパスを間違えて画像を表示され無くしてみましょう。alt="ペンギンの画像">画像が表示されない代わりに、alt属性に書かれたテキストが表示されていることがわかります。ちなみに全ての画像に無理をしてalt属性を入れる必要はありません。表示されなくても困らない画像や、文章に関係のない画像にはalt属性は省いても構いません。imgタグは空要素imgタグには属性は書きますが、タグの中には何も挟むものがありません。このようなタグは、改行タグのときにもお話ししましたが、空要素と呼びます。空要素は終了タグは必要ありませんので注意しましょう。あざらし画像を表示したい場合は、imgタグに画像のパスと代わりになるテキストを書くんだね!リストを作るタグリストとは箇条書きのことです。「やることリスト」や「好きなフルーツの一覧」などのように、項目が多い内容を伝えたい場合、箇条書きをうまく使うことで普通の文書よりも分かりやすく伝える事ができます。リストにはいくつか種類がありますが、ここでは最もシンプルなリストについて紹介します。シンプルなリストの使い方リストは<ul>タグと<li>タグをセットで使います。<ul>タグはリスト全体を表し、その中のリストの項目を<li>タグで書きます。</ul>りんごバナナキウイ箇条書きで表示されていることがわかります。リストはよく使われるタグの一つなのでマスターしておくと便利です。あざらしリストはulタグとliタグを組み合わせて使うんだ!ここではベーシックなリストを紹介しましたが、他のリストの種類や詳しい使い方については下記記事で解説しています。参考記事HTMLでリストを作ろう!内容によって3種類のリストを使い分けるリストとは箇条書きのことです。「やることリスト」や「好きなフルーツの一覧」などのように、項目が多い内容を伝えたい場合、箇条書きをうまく使うことで普通の文書よりも分かりやすく伝える事ができます。[...]タグにclassとidで目印をつけようHTMLの重要な役割を果たすclass(クラス)とid(アイディー)について解説していきます。くまなんか難しそうだな...あざらしここからはかなり実践的な内容だよ!でも難しくないし、よく使うから頑張って覚えようclassとidのメリット全てのタグにはclass属性と、id属性をつけることができます。どちらもタグに目印をつけるための属性です。目印をつけるかというと、CSSで装飾する時などに目印があると指定しやすくなるからです。class属性やid属性は主にCSSでスタイルを適用する時に使います。CSSでスタイルを適用するときに、example01は赤文字にして、example02は青文字にするというような指定をする時に、タグにつけたclass名やid名を使って指定することができるんですね。class="example01">段落1です。