はCSSプロパティを上書きします

Question

私は2つの親divビュー1と2を持っています。第2のビューを非表示にしたいが、第2のビューの表示を表示したい。

所望の出力は次のようになります。 タイトル
サンプル記述1
サンプル記述2

.view2{ 
 
    display:none; 
 
} 
 
.view2 .desc{ 
 
    display:block !important; 
 
}

<div class="view1"> 
 
    <div class="title"> 
 
    <p>Hello</p> 
 
    </div> 
 
    <div class="desc"> sample description1</div> 
 
</div> 
 
<div class="view2"> 
 
    <div class="title"> 
 
    <p>Hello</p> 
 
    </div> 
 
    <div class="desc"> sample description2</div> 
 
</div>

Answer 1

使用:not()セレクタ。

この

.view2 *:not(.desc) { 
 
    display: none; 
 
}

<div class="view1"> 
 
    <div class="title"> 
 
    <p>Hello</p> 
 
    </div> 
 
    <div class="desc"> sample description1</div> 
 
</div> 
 
<div class="view2"> 
 
    <div class="title"> 
 
    <p>Hello</p> 
 
    </div> 
 
    <div class="desc"> sample description2</div> 
 
</div>

をお試しください

Answer 2

私がコメントするprivelageを持っていませんが、そのためにJavaスクリプトを使用することができますpoupose。

element.style.visibility = "hidden"; 

Answer 3

更新のCss

.view2 .title{ 
    display:none; 
} 

スニペット例以下

.view2 .title{ 
 
    display:none; 
 
}

<div class="view1"> 
 
    <div class="title"> 
 
    <p>Hello</p> 
 
    </div> 
 
    <div class="desc"> sample description1</div> 
 
</div> 
 
<div class="view2"> 
 
    <div class="title"> 
 
    <p>Hello</p> 
 
    </div> 
 
    <div class="desc"> sample description2</div> 
 
</div>