html - 在 div 顶部修剪一个小的空三 Angular 形

Question

我正在尝试制作一个没有任何图像、纯 CSS 和 HTML 的下拉菜单，如下所示:

我无法做的是在顶部制作这个小三 Angular 形装饰

在 CSS 中是否可行，如果可行，如何实现？

Answer 1

实例:http://jsbin.com/owafod/1/

我用了CSS triangle generator创建三 Angular 形。

#Nav { 
  width: 300px;
  height: 200px;
  background: #333;
}

#Triangle {
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 10px 10px 0 10px;
    border-color: #ffffff transparent transparent transparent;
    margin: 0 auto;
}