0
votes

Ajouter un style sur la sous-classe avec CSS ou JQuery

J'aimerais pouvoir ajouter un style à toutes les classes sous le premier div, Donc, lorsque je déplace la souris sur

Toutes les classes doivent être stylisez de cette manière: p> xxx pré>

Je ne peux pas faire toute l'écriture blanche avec CSS P>

<div data-id="#hMS2r-2141" class="event-item-wrapper ">
<article itemscope=""
    class="event-list post-2141 simple_event type-simple_event status-publish has-post-thumbnail hentry simple_event_category-eventi">
    <div class="media">
        <div class="media-left media-middle">
            <div class="date-info">
                <span class="date-month">May</span>
                <span class="date-day-year">11, 2018</span>
            </div>
        </div>
        <div class="media-body media-middle">
            <div class="info-event">
                <h3 class="entry-title">Corso Acquarello</h3>
            </div>
            <div class="entry-description">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam
                nonummy ...</div>
        </div>
    </div>
</article>
</div>


1 commentaires

Veuillez clarifier votre problème spécifique ou ajouter des informations supplémentaires pour mettre en évidence exactement ce dont vous avez besoin. Comme il est actuellement écrit, il est difficile de dire exactement ce que vous demandez.


3 Réponses :


2
votes

Pour appliquer les styles à n'importe quel enfant et subchild de l'emballage sur la survolte DO

.event-item-wrapper:hover .event-list,
.event-item-wrapper:hover .media,
.event-item-wrapper:hover .media-left,
.event-item-wrapper:hover .date-info,
.event-item-wrapper:hover .date-month {
  background-color:black !important;
  color:white !important;
}


1 commentaires

2ème pièce de code peut être simplifié un peu:



1
votes
Using Jquery and css :

Jquery:
$(document).ready(function(){
    $(".event-item-wrapper").hover(function(){
        $(this).addClass("Mydivadd");
    });
});

Css:
<style>
.Mydivadd {
  background-color:red !important;
  color:white !important;
}
</style>

0 commentaires

0
votes

@exolon

Essayez ce code Ça fonctionne: P>

p>

<div data-id="#hMS2r-2141" class="event-item-wrapper" id="MouseHover">
<article itemscope=""
    class="event-list post-2141 simple_event type-simple_event status-publish has-post-thumbnail hentry simple_event_category-eventi">
    <div class="media">
        <div class="media-left media-middle">
            <div class="date-info">
                <span class="date-month">May</span>
                <span class="date-day-year">11, 2018</span>
            </div>
        </div>
        <div class="media-body media-middle">
            <div class="info-event">
                <h3 class="entry-title">Corso Acquarello</h3>
            </div>
            <div class="entry-description">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam
                nonummy ...</div>
        </div>
    </div>
</article>
</div>


0 commentaires