是否可以通过CSS制作小圆圈？

而不是使用图像，我想知道是否有人知道如何使用CSS制作带轮廓的小圆圈。是否可以通过CSS制作小圆圈？

我正在尝试制作类似于靶心标志或目标标志的东西。

2011-05-31 Erik

HTML/CSS标准，你靶向哪个？这很简单，使用'canvas'标记。（IIRC，Adobe Illustrator将导出为可嵌入页面的格式）。 – 2011-05-31 14:01:51

我想我的答案在这里正是你在找什么：http://stackoverflow.com/questions/4840736/easier-way-to-create-circle-div-than-using-an-image/4844059#4844059 - 如果没有，请告诉我。 – thirtydot 2011-05-31 14:04:16

看一看这个库： http://jsdraw2d.jsfiction.com/

对于画圆有在http://jsdraw2d.jsfiction.com/demo/circleellipse.htm

来源

2011-05-31 14:01:45

您可以使用圆角的div。

<style> 
.circle{ 
    -webkit-border-radius:8px; 
    -moz-border-radius:8px; 
    border-radius:8px; 
    border:1px solid #ccc; 
    width:8px; 
    height:8px; 
} 
</style> 
<div class="circle"></div>

但是，可能是，最好是使用canvas和JavaScript。

来源

2011-05-31 14:01:29

不知道我真正理解你的问题的例子，但是这是你如何画一个圆，CSS：

.circle 
{ 
    height: 100px; 
    width: 100px; 

    display: block; 
    border: 1px solid black; 

    border-radius: 100px; 
}

来源

2011-05-31 14:01:50

对于任何想要绘制小圆圈的人，下面的代码使用缩放来调整圆圈大小。只需调整规模值就可以了！

.circle{ 
    border: 2px solid #1111a1; 
    padding: 10px 40px; 
    background: #dddddd; 
    width: 1px; 
    height: 60px; 
    border-radius: 100px; 
    transform: scale(0.5, 0.5); 
}

Plunkr

来源

2016-11-26 17:33:32 Gabrielus

是否可以通过CSS制作小圆圈？

回答

相关问题