html - 主标题没有响应

Question

我的主标题没有改变大小以适应设备，它只是保持相同的大小而不是响应。 here is a picture of the problem.

HTML:

@media (min-width: 768px)
.middle-content .intro-text .name {
  font-size: 4.75em;
}

.middle-content  .intro-text .name {
  display: block;
  font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 10em;
  color: white;
}

<!-- Intro Section -->
<section id="intro" class="intro-section">
  <div class="container">
    <div class="row">
      <div class="middle-content col-lg-12">
        <div class="intro-text">
          <h1 class="name">nlythdsgnr</h1>
          <span class="skills">graphic designer</span>
        </div>
      </div>
    </div>
</section>

Answer 1

1)change color: white; to color: #000; for better result.

2)you miss {} in @media code.

3) replace css Codes like this :

.middle-content  .intro-text .name {
    display: block;
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 7em;
    color: #000;
}

@media screen and (max-width:740px) {
.middle-content .intro-text .name {
    font-size: 4.75em;
 }
}

4)Other Change.

这是 Demo