創(chuàng)建水平導航菜單是CSS中的一個常見應用，下面是一些實現(xiàn)方法。

方法一：使用Flex布局

Flex布局是CSS3中的一個強大布局工具，可以輕松地創(chuàng)建水平導航菜單。

<ul class="nav">
  <li><a href="#">Home</a></li>
  <li><a href="#">About</a></li>
  <li><a href="#">Services</a></li>
  <li><a href="#">Contact</a></li>
</ul>

.nav {
  display: flex;
  list-style-type: none;
  margin: 0;
  padding: 0;
  background-color: #333;
}
.nav li {
  flex: 1;
}
.nav li a {
  display: block;
  color: #fff;
  text-align: center;
  padding: 14px 0;
  text-decoration: none;
}

方法二：使用CSS Grid布局

CSS Grid布局是另一個強大的布局工具，可以用來創(chuàng)建復雜的導航結構。

<div class="nav">
  <a href="#">Home</a>
  <a href="#">About</a>
  <a href="#">Services</a>
  <a href="#">Contact</a>
</div>

.nav {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-gap: 10px;
  background-color: #333;
}
.nav a {
  color: #fff;
  text-decoration: none;
  display: block;
  padding: 14px 0;
}

方法三：使用浮動（Floats）

浮動是CSS中的一個基本特性，可以用來創(chuàng)建水平導航菜單，這種方法需要一些額外的樣式來清除浮動。

<ul class="nav">
  <li><a href="#">Home</a></li>
  <li><a href="#">About</a></li>
  <li><a href="#">Services</a></li>
  <li><a href="#">Contact</a></li>
</ul>

.nav {
  list-style-type: none;
  margin: 0;
  padding: 0;
  background-color: #333;
}
.nav li {
  float: left;
}
.nav li a {
  display: block;
  color: #fff;
  text-align: center;
  padding: 14px 0;
  text-decoration: none;
}

是三種創(chuàng)建水平導航菜單的方法，你可以根據(jù)自己的需求選擇適合的方法。