如何让导航栏中的的元素横向排列

要让导航栏中的元素横向排列，可以使用CSS中的display属性和float属性来实现。具体做法如下：

1. 将导航栏的ul标签设置为display: flex;，这样子元素就会横向排列。

2. 如果需要支持旧版浏览器，可以把ul标签的display属性设置为inline-block，这样子元素也会横向排列。

3. 给每个li标签设置一个float属性为left，这样子元素就会左对齐，横向排列。

示例代码：

<style>
  /* 使用flex布局 */
  .nav {
    display: flex;
    justify-content: space-between; /* 可以设置元素之间的间隔 */
  }
  .nav li {
    float: none;
  }
  
  /* 兼容旧版浏览器 */
  .nav {
    display: inline-block;
    *display: inline; /* 兼容IE6-7 */
    *zoom: 1; /* 兼容IE6-7 */
  }
  .nav li {
    float: left;
  }
</style>

<nav class="nav">
  <ul>
    <li>首页</li>
    <li>产品</li>
    <li>服务</li>
    <li>关于我们</li>
    <li>联系方式</li>
  </ul>
</nav>