Html 如何使用百分比条制作边框
我甚至不知道如何描述它，所以这是图片。 我指的是圆边，但好像只有一部分是红色的。另外，我不希望它是动画或任何东西，所以有可能只使用CSS和HTML，而不使用JavaScript吗？Html 如何使用百分比条制作边框,html,css,image,border,Html,Css,Image,Border,我甚至不知道如何描述它，所以这是图片。 我指的是圆边，但好像只有一部分是红色的。另外，我不希望它是动画或任何东西，所以有可能只使用CSS和HTML，而不使用JavaScript吗？ 我很想在这里得到一些帮助 我想这对你有帮助 <!DOCTYPE html> <html> <head> <title></title> <style type="text/css"> body{
我很想在这里得到一些帮助 我想这对你有帮助
<!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>
身体{
背景：黄色；
}
.形象{
高度：100px；
宽度：100px；
保证金：自动；
边界半径：50%；
边框：10px纯红；
左边框：10px实心透明；
填充：15px；
变换：旋转（45度）；
}
img{
宽度：100%；
身高：100%；
边界半径：50%；
变换：旋转（-45度）；
}