Недостаток HTML и CSS

Question

Я хотел бы, чтобы кто-то объяснил мне, как работает класс active-slide.

Код:

<div class="slider"> 
<div class="slide active-slide">..</div> 
<div class = "slide slide-feature">..</div> 
<div class = "slide">..</div> 
<div class = "slide">..</div> 

и класс slide в CSS получает свойство display:none и это не делает никакого эффекта.

<div class="slide active-slide">..</div> 

Answer 1

Оказывается, что все слайды display: none если только имея slide класс. Класс active-slide имеет display:block (или inline-block, или что-то иное, чем none). Это переопределение display:none.

.slide { 
    display: none; // says anything with class of .slide does not display 
} 
.slide.active-slide { 
    display: block; // says override the display property for items with class of .slide and .active-slide 
} 

Answer 2

конкретных Передвиньте active-slide установки класса к display: block;, что делает его видимым для пользователя.

Первоначально все слайды установлены на display: none;, и поэтому они не отображаются. Покажет только слайд с классом active-slide.