Как закрасить только половину рамки?

Question

Создаю сайт, решил сделать вот такой интересный показатель:

А что значит "только половину одной стороны" ?) Чем оно должно отличаться от картинки? — OPTIMUS PRIME, Jul 24 '19 at 17:53
Вот , видишь зелёную чуть-закруглёную полоску ? Надо закрасить нижнюю её половину — Дмитрий Хватов, Jul 24 '19 at 18:38
Делаешь что-то типа того https://stackoverflow.com/questions/21205652/how-to-draw-a-circle-sector-in-css и циферблат сверху. Но тогда у линий не будет скругления. Либо попробовать позиционировать прямоугольники и скривлять их, но это извращение мне кажется — Skywave, Jul 25 '19 at 04:48
Возможный дубликат вопроса: Progress bar circle on js — Randall, Jul 25 '19 at 07:17
Да , спасибо , я делаю это , скругления я добавил с помощью четырёх маленьких кружков расположенных по 4-ём сторонам — Дмитрий Хватов, Jul 25 '19 at 09:18

score 1 · Answer 1 · answered Jul 25 '19 at 07:45

Внимание: Это решение для данной задачи, но не полноценный ответ на вопрос. Прошу понять это и не судить строго.

.circle {
 width: 300px;
 height: 300px;
 border: 15px solid grey;
 border-left-color: lightgreen;
 border-top-color: yellow;
 border-right-color: red;
 background-color: grey;
 border-radius: 50%;
}

<div class="circle">
</div>

Как закрасить только половину рамки?

1 Answers1