如何制作带百分比栏的边框

Question

我什至不知道如何描述它，所以这是图片。 Yeah, something like that. 我的意思是圆形边框，但好像只有一部分是红色的。另外，我不希望它是动画的或任何东西，所以是否可以只使用 CSS 和 HTML，而不使用 JavaScript？
很想在这里得到一些帮助！

Answer 1

我想这对你有帮助。

    <!DOCTYPE html>
    <html>
    <head>
    <title></title>
    <style type="text/css">
    body{
    background:yellow;
    }
    .image{
    height:100px;
    width:100px;
    margin:auto;
    border-radius:50%;
    border:10px solid red;
    border-left:10px solid transparent;
    padding:15px;
    transform:rotate(45deg);
    }
    img{
    width:100%;
    height:100%;
    border-radius:50%;
    transform:rotate(-45deg);
    }
    </style>
    </head>
    <body>
    <div class="image" >
    <img src="img.jpg" />
    </div>
    </body>
    </html>

如何制作带百分比栏的边框

How to make border with percentage bar

html

css

image

border