将一个箭头引导CSS下拉菜单

我希望把这样的事情在我的下拉菜单类从引导3： What I want is next to the red arrow I draw 将一个箭头引导CSS下拉菜单

我想做somekind的的这一点，但倒挂此I want the arrow for this dropup menu

我不知道该怎么做的CSS但我必须从CSS这个类是：

.dropdown-menu { 
    margin-left: 10px; 
    } 

    .dropdown-menu > li { 
    padding-left: 10px 
    }

来源

2017-03-16 Nunix Monteiro

你需要分享您的代码（包括HTML）的工作示例。那个箭头可以用伪元素来完成，比如'：before' –

好吧，我会提供该列过滤器的那部分是否够用了？ –

这就足够了是的 –

我希望这个例子对你

有帮助

*, 
 
*:before, 
 
*:after { 
 
    box-sizing: border-box; 
 
} 
 

 
.example { 
 
    position: relative; 
 
    background: rgb(200, 30, 50); 
 
    width: 300px; 
 
    padding:10px; 
 
} 
 

 
.triangle { 
 
    display: inline-block; 
 
    vertical-align: middle; position: absolute; 
 
    right: 0; 
 
    top: 0; 
 
} 
 

 
.arrow-down { 
 
    width: 60px; 
 
    height: 30px; 
 
    border-top: solid 30px rgb(255, 255, 255); 
 
    border-left: solid 30px transparent; 
 
    border-right: solid 30px transparent; 
 
}

<div class="example"> 
 
    lorem.. 
 
    <div class="triangle arrow-down"></div> 
 
</div>

来源

2017-03-16 14:03:43

我编辑我的答案，请检查出来 –

谢谢，它的作品很棒:) –

将一个箭头引导CSS下拉菜单

回答

相关问题