写一个仿照京东购物网站官网的导航条

以下是一个简单的仿照京东购物网站官网的导航条的 HTML 和 CSS 代码示例：

HTML 代码：

<nav>
  <ul>
    <li><a href="#">首页</a></li>
    <li><a href="#">手机</a></li>
    <li><a href="#">电脑</a></li>
    <li><a href="#">家电</a></li>
    <li><a href="#">运动户外</a></li>
    <li><a href="#">服饰内衣</a></li>
    <li><a href="#">母婴童装</a></li>
    <li><a href="#">美妆个护</a></li>
    <li><a href="#">食品生鲜</a></li>
    <li><a href="#">酒水饮料</a></li>
    <li><a href="#">家具家装</a></li>
    <li><a href="#">计生情趣</a></li>
    <li><a href="#">图书音像</a></li>
    <li><a href="#">京东超市</a></li>
    <li><a href="#">全球购</a></li>
    <li><a href="#">京东金融</a></li>
  </ul>
</nav>

CSS 代码：

nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #333;
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  height: 50px;
}

nav li {
  margin: 0 10px;
}

nav a {
  text-decoration: none;
  color: #fff;
  padding: 0 10px;
  height: 50px;
  line-height: 50px;
  display: block;
}

nav a:hover {
  background-color: #c81623;
}

这段代码创建了一个包含导航链接的 `nav` 元素，链接以列表项 `li` 的形式呈现。通过使用 Flexbox 布局，链接被放置在导航条内，并且在横向空间上均匀分布。导航条的背景色为深灰色，链接的文本为白色。当鼠标悬停在链接上时，背景色变为深红色。