將一個箭頭引導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下拉菜單

回答

相關問題