CSSプロパティの継承
段落があり、その中にiタグで囲まれた
テキストがあるとします：
<p>
This is some <i>text</i> in paragraph.
</p>
段落の色を赤に設定しましょう：
p {
color: red;
}
結果として、段落のテキストだけでなく、
iタグ内のテキストも赤くなります：
これは、colorプロパティが
継承されるためです。つまり、
親要素にある色の設定は、その子孫要素にも適用されます。
すべてのCSSプロパティが継承されるわけではありませんが、
多くのプロパティが継承されます（あなたが既に知っているプロパティは
すべて継承されます）。
ただし、必要に応じて、子孫要素に対してセレクタを指定することで、 親のプロパティを上書きすることができます。 例えば、段落には赤色を、斜体（iタグ）には青色を設定してみましょう：
<p>
This is some <i>text</i> in paragraph.
</p>
p {
color: red;
}
i {
color: blue;
}
:
この場合、CSSコード内のセレクタの順序は関係ありません。
iセレクタとpセレクタの順序を入れ替えても、
同じように動作します：
<p>
This is some <i>text</i> in paragraph.
</p>
i {
color: blue;
}
p {
color: red;
}
:
以下のコードを確認し、bタグ内のテキストが
どの色になるか答えてください：
<p>
This is some <b>text</b> in paragraph.
</p>
p {
color: blue;
}
以下のコードを確認し、bタグ内のテキストが
どの色になるか答えてください：
<p>
This is some <b>text</b> in paragraph.
</p>
p {
color: blue;
}
b {
color: red;
}
以下のコードを確認し、bタグ内のテキストが
どの色になるか答えてください：
<p>
This is some <b>text</b> in paragraph.
</p>
b {
color: red;
}
p {
color: blue;
}
以下のコードを確認し、liタグ内のテキストが
どの色になるか答えてください：
<ul>
<li>text</li>
<li>text</li>
<li>text</li>
</ul>
ul {
color: blue;
}
以下のコードを確認し、liタグ内のテキストが
どの色になるか答えてください：
<ul>
<li>text</li>
<li>text</li>
<li>text</li>
</ul>
ul {
color: blue;
}
li {
color: red;
}
以下のコードを確認し、iタグ内のテキストが
どの色になるか答えてください：
<ul>
<li>text <i>italic</i> text</li>
<li>text <i>italic</i> text</li>
<li>text <i>italic</i> text</li>
</ul>
ul {
color: blue;
}
li {
color: red;
}
i {
color: green;
}
以下のコードを確認し、iタグ内のテキストが
どのサイズになるか答えてください：
<ul>
<li>text <i>italic</i> text</li>
<li>text <i>italic</i> text</li>
<li>text <i>italic</i> text</li>
</ul>
i {
font-size: 30px;
}
ul {
font-size: 20px;
}
li {
color: red;
font-weight: bold;
}
