【2025年完全版】HTMLのdivタグとは【基本〜応用まで使い方解説】
See the Pen Untitled by NNC STUDIO (@NNC-STUDIO) on CodePen.
divタグを中央に揃えるには
divタグに横幅の指定をすると画面の左に配置されます。div要素を中央に揃えるにはmarginの指定で左右の値をautoにしましょう！
See the Pen Untitled by NNC STUDIO (@NNC-STUDIO) on CodePen.
複数のdivタグの見た目を変えたい場合
1ページ内にdivタグを複数作成し、それぞれのdivタグの見た目を変えたい場合はclass属性で名前をつけることで、cssから個別の命令を出すことが可能です。
See the Pen Untitled by NNC STUDIO (@NNC-STUDIO) on CodePen.
まとめ
- ・Webページの範囲を分けるためのタグ
- ・特に意味を持たずCSSスタイリングのために使われる
- ・HTML5からはセマンティックなタグと併用する
- ・使い方は人それぞれになるので、適宜判断をして使用する
- ・横並びにする場合は親要素にdiplay:flexを指定
- ・複数のdivタグの見た目をそれぞれ変更する場合はclass属性を使用
おまけ – sectionとdivの違い
以前にsectionとdivの違いについてもまとめているので、違いが気になるという方は下の記事をご覧ください。
こちらの記事はいかがでしたか？ Related postsRECENT ENTRIES
- Web制作会社がAIを導入して変わったこと｜実例付きメリット・デメリット
- 【ローカルWordPress】https://localhost に勝手にリダイレクトされる原因と解決法｜SSLエラー「ERR_SSL_PROTOCOL_ERROR」の直し方
- GEO・SGEとは？SEOとの違い | 導入方法や効果など徹底紹介
- コーディング不要でハンバーガーメニュー作成！「Hamburger Menu Generator」の使い方と特徴を徹底解説