html - 如何居中固定的垂直导航 css？

Question

太好了，我想知道如何保持导航固定但同时垂直居中。 另外，如果有任何改进代码的建议，请告诉我 :)

<nav>


<span style="color:#B80003; font-size:24px; text-decoration:underline;">Home</span>
<br>
 <a href="music.html">Music</a>
<br>
<a href="pics.html">Pics</a>
<br>
<a href="tour.html">Tour</a>

</nav>


nav {
font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
    font-variant:small-caps;
    font-size:18px;
    position: fixed;
    top: 0;
   left: 0;
 z-index: 9999;
}

Answer 1

nav {
font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
font-variant:small-caps;
font-size:18px;
position: fixed;
/* top: 0; */
   left: 0;
 z-index: 9999;
top: 50%;
transform: translateY(-50%);
}

<nav>


<span style="color:#B80003; font-size:24px; text-decoration:underline;">Home</span>
<br>
 <a href="music.html">Music</a>
<br>
<a href="pics.html">Pics</a>
<br>
<a href="tour.html">Tour</a>

</nav>