Question

 $file = $_POST['file'];

这是我到目前为止所拥有的。我有一个链接到我自己的样式表，目前没有风格。到目前为止只是HTML。我试图将链接以图像为中心而不是位于顶部。如果可能的话，我宁愿不使用填充。

Answer 1

您可以向父级添加一个类，并将其设置为display: flex; align-items: center;以使元素垂直居中。

.nav-container {
  display: flex;
  align-items: center;
}

<!DOCTYPE html>
<html>

<head>
  <title>Funky Munky Arcade</title>

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

  <link rel="stylesheet" type="text/css" href="style.css">

</head>

<body>

  <nav class="navbar navbar-default navbar-fixed-top">

    <div class="container nav-container">

      <div class="navbar-header">

        <a href="/index.html" class="navbar-left"><img src="http://kenwheeler.github.io/slick/img/fonz1.png" class="logo"></a>

      </div>

      <ul class="nav nav-justified">
        <li><a href="#">Home</a></li>
        <li><a href="#">Parties</a></li>
        <li><a href="#">Contact</a></li>
      </ul>

    </div>

  </nav>

  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

</body>

</html>

如何在导航栏中将链接置于图像中心而不是位于顶部？

1 个答案: