导航栏符合徽标

时间:2016-04-16 23:06:54

标签: html css shopify

我需要导航方面的帮助,以使其符合徽标。基本上在徽标和货币按钮之间。

有没有一种简单的方法来实现它而不是搞乱div和许多css调整?

我对html的了解非常基础,所以在这里寻求帮助。谢谢!

header

<header class="main-header">

<div class="bg" style="display: none;"></div>

<div class="row top">

<div class="columns">

<div class="search-account columns">

</div>

<div class="bottom-row">

<div class="row">

</div>

<div class="main-menu-dropdown-panel">

<div class="row"> </div>

</div>

<div class="mobile-menu">

<div class="row">

</header>

1 个答案:

答案 0 :(得分:0)

这是您可以使用的基本模板。

&#13;
&#13;
header h1,
ul,
li {
  display: inline-block;
}
ul {
  float: right;
}
body {
  margin: 0;
  padding: 0;
}
h1 {
  margin: 0 0 0 10px;
  font-family: verdana;
  font-weight: 100;
}
a {
  text-decoration: none;
  color: black;
  margin-right: 10px;
  font-family: arial;
  font-weight: 100;
}
a:hover {
  color: orange;
}
&#13;
<!DOCTYPE html>
<html>

<head>
  <title></title>
</head>

<body>
  <header>
    <img src="logo.png" alt="logo">
    <h1>Heading</h1>
    <ul>
      <li><a href="#">Link 1</a>
      </li>
      <li><a href="#">Link 2</a>
      </li>
      <li><a href="#">Link 3</a>
      </li>
      <li><a href="#">Link 4</a>
      </li>
    </ul>
  </header>
</body>

</html>
&#13;
&#13;
&#13;