Можно ли из css создать треугольник со всеми тремя сторонами разного цвета?

Question

Я пытаюсь создать на своей веб-странице треугольник со всеми тремя сторонами разного цвета ... предложите, пожалуйста, как

Answer 1

Вы можете использовать SVG, например:

@charset "UTF-8";
.str2 {stroke:blue;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:22.9256}
.str0 {stroke:lime;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:22.9256}
.str1 {stroke:red;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:22.9256}
.fil0 {fill:none}

<svg width="360px" height="360px" viewBox="0 0 360 360">
 <g id="Layer_x0020_1">
  <g id="_2422114433216">
   <line class="fil0 str0" x1="180" y1="32.62" x2="9.82" y2= "327.38" />
   <line class="fil0 str1" x1="180" y1="32.62" x2="350.18" y2= "327.38" />
   <line class="fil0 str2" x1="350.18" y1="327.38" x2="9.82" y2= "327.38" />
  </g>
 </g>
</svg>

Таким образом, вы можете делать с ним практически все, что захотите, например, динамически менять цвета или устанавливать эффект наведения, или все, что вы можете делать с элементами HTML .