JSFiddle - React, Tailwind, and code Playground

HTML

<div class="parent">Text of the parent
    <p class="class1">I do not need to trigger parent's background color change!</p>
</div>

CSS

.parent {
    background: #ffffff;
}
.parent:hover {
    background: #aaaaff;
}
.parent *:hover {
    background: #ffffff;
}
.class1 {
    margin: 10px;
}