为什么按照老师写的代码，顶部的三角和三角里面的图颜色变了，H2 和P没有变颜色呢

为什么按照老师写的代码，顶部的三角和三角里面的图颜色变了，H2 和P没有变颜色呢

.st-color{ background:#fa96b5;}
.st-color .st-desc{ background:#fff;}
.st-color [data-icon]:after{ color:#fa96b5;}
.st-color h2{ color:#fff; text-shadow:1px 1px 1px rgba(0,0,0.1)}
.st-color p{ color:#fff;}

<div class="st-scroll">
      <section class="st-panel" id=" st-panel-1">
        <div class="st-desc" data-icon="H"></div>
        <h2>Serendipity</h2>
        <p>中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中</p>
      </section>
      <section class="st-panel st-color" id=" st-panel-2">
        <div class="st-desc" data-icon="2"></div>
        <h2>Happiness</h2>
        <p>中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中</p>
      </section>
      <section class="st-panel" id=" st-panel-3">
        <div class="st-desc" data-icon="B"></div>
        <h2>Tranquillity</h2>
        <p>中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中</p>
      </section>
      <section class="st-panel st-color" id=" st-panel-4">
        <div class="st-desc" data-icon="X"></div>
        <h2>Positivity</h2>
        <p>中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中</p>
      </section>
      <section class="st-panel" id=" st-panel-5">
        <div class="st-desc" data-icon="C"></div>
        <h2>Passion</h2>
        <p>中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中</p>
      </section>
    </div>