ついつい忘れがちですがHTMLにはインライン要素とブロック要素があります。そして
- ブロックレベル要素 ： ブロックレベル要素とインライン要素を含むことができる。
- インライン要素 ： コンテンツとインライン要素しか含むめない。
これはHTMLの設計がブロックレベル要素が「より大きな構造を構築する」という考え方だからです。
ざっくり言うと、セクショニング（構造をつくる）要素はブロック要素で、細かい修飾をする要素が、インライン要素と言えるかもしれません。
よく使うブロックレベル要素
<address> ：意外とどっちかなー？と思いつつブロックレベル。個人的にインライン寄り。
<article> <aside> <footer> <header> <h1~6> <nav> <section>：全部構造を作る系のタグなので納得のブロックレベル。
<div> ：ブロックレベルの代表格。
<ul> <li> ：これもリスト構造作るから。
<pre> ：整形済みテキスト。これもインラインよりと思いつつブロックレベル要素。
<hr> ：テーマの区切り。水平線。これもインラインより。
よく使うインライン要素
<b> ：文章を修飾するのでインライン。
<storng> ：文章を修飾するのでインライン。
<code> ：文章を修飾するのでインライン。
<small> ：文章を修飾するのでインライン。
<span> ：文章を修飾するのでインライン。
<cite> ：作品のタイトルまたはURLを囲う。文章を修飾するのでインライン。
<q> ：引用情報を囲う。文章を修飾するのでインライン。
<blockquote> ：長文の引用情報を囲う。文章を修飾するのでインライン。
どっちか迷う要素たち
<table> ：テーブルという構造を作るから、ブロックライン。
<form> ：フォームという構造を作るから、ブロックライン。
<button> ：フォームの要素系はインライン。
<input> ：インライン。
<label> ：インライン。
気をつけるべき要素たち
<a> ：インライン要素だがHTML5からはブロックレベル要素を含めることが可能に。
参照
MDN web docs | ブロックレベル要素
MDN web docs | インライン要素
MDN web docs | HTML要素リファレンス