Как скрыть элемент в div, кроме одного?

Question

У меня есть этот HTML-код, и я хотел бы, чтобы скрыть текст «Ясно, Ветер: 2,4 км/ч, Влажность: 100%»

<div class="flxvrJtnbd theDayInfos"> 
    Cloudy<br> 
    Wind : 2.4 km/h<br> 
    Humidity : 100%<br> 
    <span class="dhpflXvrjt degrees coldDegrees"> 
     19°C         
    </span> 
</div> 

Мне просто нужно, чтобы показать степень.

я попробовал что-то вроде:

.theDayInfos:not(.degrees){ 
    display: none; 
} 

Это did'nt работы. Существуют ли другие способы достижения этого?

Благодарим за помощь!

Answer 1

Вы можете использовать размер шрифта

.flxvrJtnbd.theDayInfos { 
 
    font-size:0rem;/*very old browsers won't take it */ 
 
    } 
 
.dhpflXvrjt.degrees.coldDegrees { 
 
    font-size:1rem;/*very old browsers won't take it */ 
 
}

<div class="flxvrJtnbd theDayInfos"> 
 
    Cloudy<br> 
 
    Wind : 2.4 km/h<br> 
 
    Humidity : 100%<br> 
 
    <span class="dhpflXvrjt degrees coldDegrees"> 
 
     19°C         
 
    </span> 
 
</div>

Answer 2

вы можете только обернуть их каким-либо элементом и скрыть этот элемент.

Answer 3

Вы хотите, чтобы каждый один, чтобы быть пролетом то скрыть, если это оболочка не имеет соответствующий класс

как это.

.theDayInfos span:not(.degrees) { 
 
    display: none; 
 
}

<div class="flxvrJtnbd theDayInfos"> 
 
    <span>Cloudy<br></span> 
 
    <span>Wind : 2.4 km/h<br></span> 
 
    <span>Humidity : 100%<br></span> 
 
    <span class="dhpflXvrjt degrees coldDegrees"> 
 
     19°C         
 
    </span> 
 
</div>

Answer 4

Wrap текст, который вы хотите скрыть его в другой элемент:

<style> 
.theDayInfos *:not(.degrees){ 
    display: none; 
} 
</style> 

<div class="flxvrJtnbd theDayInfos"> 
    <div> 
     Cloudy<br> 
     Wind : 2.4 km/h<br> 
     Humidity : 100%<br> 
    </div> 
    <span class="dhpflXvrjt degrees coldDegrees"> 
     19°C         
    </span> 
</div>