使用css在子菜单前添加三角形

Question

如何将三角形添加到以下示例Fiddle 中

我需要删除带有白色背景的父菜单并显示三角形以使其看起来更像这样

我试图添加以下 css，但我不工作

.dropdown li:first-child > a:after {
{
    content: '';
    position: absolute;
    left: 10px;
    top: -5px;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #0A8F36;
    opacity:0.6;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);
}

更新：

我设法让它在某种程度上工作，但仍然有一些设计问题，任何帮助表示赞赏

最新小提琴http://jsfiddle.net/wPWDm/17/

Answer 1

希望这会有所帮助，我已经注释掉了您的一些 css 和 jquery 脚本。另外，在最后添加了一个样式，请参考这个链接小提琴

我添加的css如下，

.dropdown ul li:first-child > a:after {
 content: '';
 position: absolute;
 left: 30px;
 top: -8px;
 width: 0;
 height: 0;
 border-left: 5px solid transparent;
 border-right: 5px solid transparent;
 border-bottom: 8px solid #028F41;
 }