Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://developer.cdn.mozilla.net/ja/docs/Web/CSS/CSS_cascade/Inheritance below:

継承 - CSS: カスケーディングスタイルシート | MDN

CSS において、継承 (inheritance) はある要素のあるプロパティに値が指定されなかった場合の挙動を制御します。

CSS プロパティは 2 種類に分類することができます。

• 継承プロパティは、既定で親要素の計算値に設定されるものです
• 非継承プロパティは、既定でそのプロパティの初期値に設定されるものです

いずれかの CSS プロパティの定義を参照して、それぞれのプロパティが既定値を継承するか ("継承: あり") しないか ("継承: なし") を確認してください。

要素の継承プロパティに値が指定されなかった場合、要素はその親要素のプロパティの計算値を取得します。文書のルート要素だけは、プロパティの概要で与えられた初期値を取得します。

継承プロパティの一般例として color プロパティが挙げられます。以下のスタイルルールとマークアップを考えてみましょう。

<p>この段落には<em>強調されたテキスト</em>があります。</p>

「強調されたテキスト」という文字列は、 em 要素が p 要素から color プロパティの値を継承する為、プロパティの初期値 (※祖先要素の何れにも color プロパティが指定されていない場合に使用される文字色) ではなく、継承値の緑色となります。

値を持たない非継承プロパティが要素に指定された場合、要素はプロパティの初期値（プロパティのページの「概要」の節に記されています）を取得します。

非継承プロパティの一般的な例としては border プロパティが挙げられます。以下のスタイルルールとマークアップを考えてみましょう。

p {
  border: medium solid;
}

<p>この段落には<em>強調されたテキスト</em>があります。</p>

この場合、「強調されたテキスト」という文字列には (border-style の初期値が none であるため) 境界線がありません。

inherit のキーワードで、明示的に継承することを指定することができます。これはこれは継承プロパティでも非継承プロパティでも動作します。

すべてのプロパティに値を適用する all 一括指定プロパティを使用することで、すべてのプロパティの継承を制御することができます。例えば、

p {
  all: revert;
  font-size: 200%;
  font-weight: bold;
}

これは、 font プロパティのスタイルを、ユーザーのスタイルシートがなければユーザーエージェントの既定値に、あればその値に戻します。それからフォントの寸法を倍にして、 font-weight に "bold" を適用します。

前回の border を使用した例で、 inherit で継承を明示的に設定すると次のようになります。

p {
  border: medium solid;
}

em {
  border: inherit;
}

<p>この段落には<em>強調されたテキスト</em>があります。</p>

「強調されたテキスト」という単語の周りに別の境界線ができます。

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4