境界線の幅をゼロ幅の要素に適用すると、境界線の色が変化する

Question

私は、幅が0の要素にborder-topとborder-leftを使用して三角形を作成しています。

.triangle { 
 
    border-top: solid 100px red; 
 
    border-left: solid 100px blue; 
 
    width: 0; 
 
    margin: 10px; 
 
} 
 
.borderRadius { border-radius: 10px; }

<div class="triangle"></div> 
 
<div class="triangle borderRadius"></div>

border-radiusが素子に印加された場合は、赤い境界線が青色に変わります！ JSfiddle here：https://jsfiddle.net/brentonstrine/3z3gqwts/

何が起こっているのですか？私の三角形に角をつける方法はありますか？

Answer 1

あなたはすべての国境を宣言する必要がある場合がありますあなたの三角形の丸い枠線を取得するには：「？ここで何が起こっている」

div { 
    border-top: solid 50px red; 
    border-right: solid 50px red; 
    border-left: solid 50px blue; 
    border-bottom: solid 50px blue; 
    width: 10px; 
    height: 10px; 
} 

DEMO