制御継承(継承、初期、unset)

4306 ワード

木曜日


今日習った内容


-選択者の継承を制御する方法


制御継承には-initial、inherit、unsetの3つの要素があります.
前の2つの要素は、別のcssを無視し、親の値に従います.
   <div class="parent">
        parent
        <div class="child1">child1</div>
        <div class="child2">child2</div>
    </div>
    
    <div class="parent2">
        parent
        <div class="child1">child1</div>
        <div class="child2">child2</div>
    </div>

.parent, .parent2{
    color: blue;
    font-size: 20px;
}

div {
    border: 1px solid silver;
    margin: 2px;
}

.parent *{
    all: initial;
}
.parent2 *{
    all:inherit;
}

.parent2 .child2 {
	color:red
}

何も応用されていなければ。



親へのinitialの適用
親2に継承が適用されます.
違いが見えますか?
親からもらった属性が解かれている様子です.
しかし、Parent 2の両親が受け取った速成フォントサイズは20と青がそのままです.
Initialは完全に強力な属性で、親から得たものはすべて消滅します.
受け継がれた親から受けた受け継ぎはそのままで、残りは愛想がいい

設定されていません


2つのアトリビュートは、時間によって使用されます.
属性が受信できない場合は、 initialを使用します.inherit,
親がもらうものがあったので inheritで起動しました.