html导航栏箭头实现代码

以下是一个简单的HTML导航栏箭头实现代码：

<nav>
  <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">About</a>
      <ul>
        <li><a href="#">Our Team</a></li>
        <li><a href="#">Mission</a></li>
        <li><a href="#">History</a></li>
      </ul>
    </li>
    <li><a href="#">Services</a></li>
    <li><a href="#">Contact</a></li>
  </ul>
</nav>

<style>
nav ul ul {
  display: none;
}

nav ul li:hover > ul {
  display: inherit;
}

nav ul {
  background: #efefef; 
  padding: 0;
  list-style: none;
  position: relative;
  display: inline-table;
}

nav ul:after {
  content: ""; clear: both; display: block;
}

nav ul li {
  float: left;
}

nav ul li:hover {
  background: #4b545f;
}

nav ul li:hover a {
  color: #fff;
}

nav ul li a {
  display: block; 
  padding: 0 10px;
  color: #757575; 
  text-decoration: none;
}

nav ul ul {
  background: #5f6975; border-radius: 0px; padding: 0;
  position: absolute; top: 100%;
}

nav ul ul li {
  float: none; 
  position: relative;
}

nav ul ul li a {
  padding: 0 10px;
  color: #fff;
}

nav ul ul li a:hover {
  background: #4b545f;
}

nav ul ul ul {
  position: absolute; left: 100%; top:0;
}
</style>

此代码使用了HTML和CSS来创建一个基本的导航栏，并在下拉菜单中添加了箭头。当鼠标悬停在带有下拉菜单的菜单项上时，箭头将自动旋转以指示菜单已展开。