当我关闭响应导航菜单时，文本在关闭前会改变字体大小，我希望在字体大小改变之前让它滑入。它就是这样构造的；

<div class="top-bar">
        <button class="top-bar__nav-toggle hamburger" id="top-nav-toggle">
          <span></span>
          <span></span>
          <span></span>
        </button>
        <nav class="top-bar__nav collapsed" id="top-bar__nav">
          <ul class="top-bar__nav-list nav-ul">
            <li>
              <a class="navlink" href="#">Home</a>
            </li>
            <li>
              <a class="navlink" href="#Portfolio">Work</a>
            </li>
            <li>
              <a class="navlink" href="#About">About</a>
            </li>
            <li>
              <a class="navlink" href="#Contact">Contact</a>
            </li>
          </ul>
        </nav>
      </div>

样式如下；

<div class="top-bar">
        <button class="top-bar__nav-toggle hamburger" id="top-nav-toggle">
          <span></span>
          <span></span>
          <span></span>
        </button>
        <nav class="top-bar__nav collapsed" id="top-bar__nav">
          <ul class="top-bar__nav-list nav-ul">
            <li>
              <a class="navlink" href="#">Home</a>
            </li>
            <li>
              <a class="navlink" href="#Portfolio">Work</a>
            </li>
            <li>
              <a class="navlink" href="#About">About</a>
            </li>
            <li>
              <a class="navlink" href="#Contact">Contact</a>
            </li>
          </ul>
        </nav>
      </div>

并通过此代码进行动画；

<div class="top-bar">
        <button class="top-bar__nav-toggle hamburger" id="top-nav-toggle">
          <span></span>
          <span></span>
          <span></span>
        </button>
        <nav class="top-bar__nav collapsed" id="top-bar__nav">
          <ul class="top-bar__nav-list nav-ul">
            <li>
              <a class="navlink" href="#">Home</a>
            </li>
            <li>
              <a class="navlink" href="#Portfolio">Work</a>
            </li>
            <li>
              <a class="navlink" href="#About">About</a>
            </li>
            <li>
              <a class="navlink" href="#Contact">Contact</a>
            </li>
          </ul>
        </nav>
      </div>

我对此很陌生，甚至不知道如何用短语搜索来找到这个答案。谢谢您的帮助！

顺晟科技：