目次
CSSの由来でもある、スタイル継承の仕組みについて見ていきます。
スタイルの継承
前回まででCSSの文法についてみてきました。
詳しくは『CSSの文法とコメントの書き方について【CSSを書いていこう】』を御覧ください。
今回はスタイルの継承という考え方について見ていきます。
CSSではスタイルを子要素に継承して子要素でも同じスタイルを適用することがあり、それをスタイルの継承と言います。
例えばbodyの中にh1とpタグがあるHTMLを書いてあったとします。
h1にはcolorをredにしていたけれどpにも同じようにredにしたいと思った場合、スタイルの継承を利用するとbodyの方にcolor: red;を指定してあげることによりh1にもpにもスタイルをすることが出来る仕様です。
これはbodyのスタイルがその子要素であるh1やpに引き継がれたからです。これを使いこなすと効率的にコーディングをすることができます。
Cascading Style Sheets
ちなみにCSSはCascading Style Sheetsの略で段階的に流れていくという意味になります。
これは親要素から子要素にスタイルを継承していく様子からこういった名前になったのでイメージをしやすいように覚えておくといいでしょう。
ただ、すべてのスタイルが継承されるわけではありません。継承されないプロパティも多くあるのでその調べ方は明日見ていきましょう。
以上