css - 带圆角的 CSS 菜单

Question

我想创建一个带有圆角的导航菜单，如下图所示，我还希望它仅使用 CSS 而不是图像。

点击这里查看图片

标签： cssmenu

Answer 1

您只需要添加border-radius属性。

 Eg : border-radius: 4px;

更新

li {
   margin-left: 2px;
   padding:5px;
   float: left;
   border: 1px solid black;
   border-radius: 6px;
   overflow:hidden;
}

<ul>
  <li>Home</li>
  <li>About Us</li>
  <li>Admission</li>
</ul>