インライン要素とブロックレベル要素（ブロック要素） - nicepaper @ ウィキ

ここでは、インライン要素とブロックレベル要素についてまとめていきます。

HTML5で廃止？

　いきなりですが、HTML5からインライン要素、ブロックレベル要素という概念はなくなりました。（ややこしいですが、概念はなくなりましたが、一応存在としては残っています。）「コンテンツ・モデル」という考え方になり、各要素の内包できるものや内包されるものが決められており、それ以外の要素は入れてはいけない。という概念に移りつつあります。 よくCSSで

display: inline;
display: block;

などと記述されますが、それとは 別のものである と考えてください。 色々な記事を拝見しますと、これまでは見た目重視（ブロックレベル要素、インライン要素の使用）のところから文章構造（クローラに正しく解釈させられるか）という方向に移りつつあるようです。 http://creator.aainc.co.jp/archives/4045
例：ブロックレベル要素の中にインライン要素
正しいのは以下

<p><strong>この表現はいい</strong></p>

正しくないのは以下

<strong><p>これはダメ</p></strong>

http://www.mdn.co.jp/di/articles/2605/?page=8

ブロックレベル要素とインライン要素

とある記事に

divは代表的なブロックレベル要素だ。ブロックレベル要素は新しい行に配置される。そして、ブラウザサイズに応じて、可能な限り左右に引き延ばされる。pやformもブロックレベル要素だ。HTML5で新しく追加されたheader、footer、sectionなどもブロックレベル要素である。

ブロックレベル要素とインライン要素一覧

ブロックレベル要素

   <address>
   <blockquote>
   <center>
   <dir>
   <div>
   <dl>
   <fieldset>
   <form>
   <h1>-<h6>
   <hr>
   <isindex>
   <menu>
   <noframes>
   <noscript>
   <ol>
   <p>
   <pre>
   <table>
   <ul>
   <header>
   <footer>
   <article>
   <section>
   <aside>

インライン要素

   <a>
   <abbr>
   <acronym>
   <applet>
   <b>
   <basefont>
   <bdo>
   <big>
   <br>
   <button>
   <cite>
   <code>
   <dfn>
   <em>
   <font>
   <i>
   <iframe>
   <img>
   <input>
   <kbd>
   <label>
   <map>
   <object>
   <q>
   <s>
   <samp>
   <script>
   <select>
   <small>
   <span>
   <strike>
   <strong>
   <sub>
   <sup>
   <textarea>
   <tt>
   <u>
   <var>

ブロックレベル要素の特徴

縦に改行(積まれていくイメージ)されていく
幅と高さを指定する事ができる
上下左右にmarginとpaddingを指定できる
text-alignは要素の中身に適応される
vertical-alignは指定できない

インライン要素の特徴

横に並んでいくイメージ
幅や高さは内容物の大きさについて
左右だけにmarginやpaddingを指定する事ができる
text-alignを親ブロックにつけることで指定できる
vertical-alignを指定できる

参照元：http://ja.learnlayout.com/display.html