CSSプロパティの継承

段落があり、その中にiタグで囲まれたテキストがあるとします：

html<p>
  This is some <i>text</i> in paragraph.
</p>

段落の色を赤に設定しましょう：

cssp {
  color: red;
}

結果として、段落のテキストだけでなく、 iタグ内のテキストも赤くなります：

これは、colorプロパティが継承されるためです。つまり、親要素にある色の設定は、その子孫要素にも適用されます。すべてのCSSプロパティが継承されるわけではありませんが、多くのプロパティが継承されます（あなたが既に知っているプロパティはすべて継承されます）。

ただし、必要に応じて、子孫要素に対してセレクタを指定することで、親のプロパティを上書きすることができます。例えば、段落には赤色を、斜体（iタグ）には青色を設定してみましょう：

html<p>
  This is some <i>text</i> in paragraph.
</p>

cssp {
  color: red;
}
i {
  color: blue;
}

Результат:

この場合、CSSコード内のセレクタの順序は関係ありません。 iセレクタとpセレクタの順序を入れ替えても、同じように動作します：

html<p>
  This is some <i>text</i> in paragraph.
</p>

cssi {
  color: blue;
}
p {
  color: red;
}

Результат:

Задание 1

以下のコードを確認し、bタグ内のテキストがどの色になるか答えてください：

html<p>
  This is some <b>text</b> in paragraph.
</p>

cssp {
  color: blue;
}

Задание 2

以下のコードを確認し、bタグ内のテキストがどの色になるか答えてください：

html<p>
  This is some <b>text</b> in paragraph.
</p>

cssp {
  color: blue;
}
b {
  color: red;
}

Задание 3

以下のコードを確認し、bタグ内のテキストがどの色になるか答えてください：

html<p>
  This is some <b>text</b> in paragraph.
</p>

cssb {
  color: red;
}
p {
  color: blue;
}

Задание 4

以下のコードを確認し、liタグ内のテキストがどの色になるか答えてください：

html<ul>
  <li>text</li>
  <li>text</li>
  <li>text</li>
</ul>

cssul {
  color: blue;
}

Задание 5

以下のコードを確認し、liタグ内のテキストがどの色になるか答えてください：

html<ul>
  <li>text</li>
  <li>text</li>
  <li>text</li>
</ul>

cssul {
  color: blue;
}
li {
  color: red;
}

Задание 6

以下のコードを確認し、iタグ内のテキストがどの色になるか答えてください：

html<ul>
  <li>text <i>italic</i> text</li>
  <li>text <i>italic</i> text</li>
  <li>text <i>italic</i> text</li>
</ul>

cssul {
  color: blue;
}
li {
  color: red;
}
i {
  color: green;
}

Задание 7

以下のコードを確認し、iタグ内のテキストがどのサイズになるか答えてください：

html<ul>
  <li>text <i>italic</i> text</li>
  <li>text <i>italic</i> text</li>
  <li>text <i>italic</i> text</li>
</ul>

cssi {
  font-size: 30px;
}
ul {
  font-size: 20px;
}
li {
  color: red;
  font-weight: bold;
}