Css Adjacent and Tilde

by kuyabiye

HTML

<div class="selector">
    <h1>Adjacent Selector</h1>
    <p>1</p>
    <p>2</p>
    <p>3</p>

</div>

<div class="selector-2">
    <h1>Tilde Selector</h1>
    <p>1</p>
    <p>2</p>
    <p>3</p>

</div>

CSS

.selector h1 + p {
    color: red;
}

.selector-2 h1 ~ p {
    color: red;
}