CSS |在div末尾添加正對三角形

-2

如何在div末尾添加正對三角形？我希望div的內容/大小是相同的，只需要在div右側面向右三角形。謝謝。CSS |在div末尾添加正對三角形

2016-10-18 J Doe

content ►

< - 田田！ – adeneo

預計您至少會嘗試自行編寫此代碼。堆棧溢出不是代碼寫入服務。我建議你做一些[**額外的研究**]（http://meta.stackoverflow.com/questions/261592/how-much-research-effort-is-expected-of-stack-overflow-users），無論是通過谷歌或通過搜索，做出嘗試和。如果您仍然遇到麻煩，請返回**您的代碼**並解釋您嘗試過的以及爲什麼它不起作用。 –

@Paulie_D感謝您的回覆，不幸的是這不是我正在尋找的答案。 –

對於右箭頭在內容框的中間

.arrow_box { 
 
    position: relative; 
 
    background: #88b7d5; 
 
    border: 2px solid #c2e1f5; 
 
    height: 40px; 
 
    width: 80px; 
 
} 
 
.arrow_box:after, 
 
.arrow_box:before { 
 
    left: 100%; 
 
    top: 50%; 
 
    border: solid transparent; 
 
    content: " "; 
 
    height: 0; 
 
    width: 0; 
 
    position: absolute; 
 
    pointer-events: none; 
 
} 
 
.arrow_box:after { 
 
    border-color: rgba(136, 183, 213, 0); 
 
    border-left-color: #88b7d5; 
 
    border-width: 10px; 
 
    margin-top: -10px; 
 
} 
 
.arrow_box:before { 
 
    border-color: rgba(194, 225, 245, 0); 
 
    border-left-color: #c2e1f5; 
 
    border-width: 13px; 
 
    margin-top: -13px; 
 
}

<div class="arrow_box"></div>

來源

2016-10-18 20:09:54 aashi

CSS |在div末尾添加正對三角形

回答

相關問題