初心者必見!レイアウトで失敗する前に”divタグ”を理解しよう。初心者必見!レイアウトで失敗する前に”divタグ”を理解しよう。HTML・HTMLリファレンス・WEB今回はHTMLタグの「divタグ」について勉強していくよ。まとめdivタグとは?divタグはブロック要素のタグで、英語のdivided(ディヴァイディッド)の略。日本語で「分割した」といった意味です。絶対覚えておこうぜといいながら実は「divタグ」自体には意味はないんです。divタグだけを書いてもなにも表示されないんです。ちなみにdivタグはブロック要素となっています。ユトピと、無言の吹き出しに見えますが、裏のコードではdivタグと書いています。こんな感じでブラウザにはなにも出てきません。いうときに使うかさて、この意味を持たないdivタグさんは一体いつ使えばいいのか?divタグの役割は『グールプ化』をさせることです。たくさんのHTMLコードをずらーっと書いたとしましょう。ヘッダーのタグたち、サイドバーのタグたち、フッターのタグたち、メインコンテンツのタグたちなどずらーっと書きます。するとどこからどこまでがヘッダーに使われたタグで、どこからがサイドバーのタグなのかがわからなくなってしまいますね。ならないためにdivタグを使ってグループにしておきます。ヘッダーで使われているタグをすべて囲んでグループにしておけば、どこからどこまでがヘッダーなのかを区別することができますね。divタグのHTMLタグをグループに区分けするのが役割なのです。ちなみにdivタグはidやclassを使って名前を付けるとなおわかりやすくなりますよ。divタグの使い方では実際にコードを見てもらいましょう。id="sidebar"><p>僕はサイドバーグループだよ!</p><p>僕はサイドバーグループだよ!</p><p>僕はサイドバーグループだよ!</p><p>僕はサイドバーグループだよ!</p><p>僕はサイドバーグループだよ!</p></div>2か所にdivタグを使用しました。ここでは複数のpタグで囲まれた文章をid名=header、つまりヘッダーとid名=sidebar、つまりサイドバーのタグのグループに分けるためにdivタグを使いました。このようなイメージでグループ化していきます。これだけだとブラウザの表示上はなにも変わらないです。僕はヘッダーグループだよ!僕はヘッダーグループだよ!僕はヘッダーグループだよ!僕はヘッダーグループだよ!僕はヘッダーグループだよ!僕はサイドバーグループだよ!僕はサイドバーグループだよ!僕はサイドバーグループだよ!僕はサイドバーグループだよ!僕はサイドバーグループだよ!divタグをグループ化のみで使用するときは基本的にコーディングをしている人の目印としてしか役に立ちません。!このdivタグには秘められた力があります!それはalign属性使えることだよ!align(アライン)は日本語で「整列させる」という意味。google翻訳が言ってた。