html - 子要素が CSS スタイルを継承しないようにする方法

Question

内部に<div>要素を持つ要素があります：<p>

<div style="font-size:10pt; color:red;">
    This is my Parent Div.
    <p>This is my Child Paragraph.</p>
    My parent Div Ends Here.
</div>

段落が に設定された CSS プロパティを継承しないようにするにはどうすればよい<div>ですか?

Answer 1

あなたの場合、最良の方法は、<p>要素が継承しているスタイルを正しくすることです。

したがって、CSSファイルでは、インラインスタイルの代わりに使用する必要があります。

.parent-div {
    font-size: 10pt;
    color: red;
}

.child-paragraph {
    font-size: 12pt;
    color: black;
}

Answer 2

CSSのセレクターを使用して>、の直接の子を選択できpますdiv。

フィドルリンク

div > p {
    font-size:1.2 em;
    color: green;
}

Answer 3

子ノードで -

<p style="font-size:12pt; color:black;">This is my child</p>

インライン スタイルを好きなように設定するだけです。