使用svg画两个小圆圈从上而下用一条线连接
时间: 2023-12-04 14:02:39 浏览: 32
好的,以下是使用SVG画两个小圆圈从上而下用一条线连接的代码:
```html
<svg width="100" height="100">
<circle cx="50" cy="25" r="10" fill="blue" />
<circle cx="50" cy="75" r="10" fill="red" />
<line x1="50" y1="25" x2="50" y2="75" stroke="black" stroke-width="2" />
</svg>
```
这个代码会在SVG区域内画一个蓝色圆圈和一个红色圆圈,分别位于SVG区域的上方和下方中心位置。圆圈的半径为10。两个圆圈之间使用一条黑色线连接,线的宽度为2。你可以根据需要修改圆圈的颜色、大小和位置,也可以修改线的颜色和宽度。
相关问题
使用svg画两个小空心圆圈从上而下用一条线连接
好的,以下是使用SVG画两个小空心圆圈从上而下用一条线连接的代码:
```html
<svg width="100" height="100">
<circle cx="50" cy="25" r="10" fill="none" stroke="blue" stroke-width="2" />
<circle cx="50" cy="75" r="10" fill="none" stroke="red" stroke-width="2" />
<line x1="50" y1="25" x2="50" y2="75" stroke="black" stroke-width="2" />
</svg>
```
这个代码会在SVG区域内画一个蓝色空心圆圈和一个红色空心圆圈,分别位于SVG区域的上方和下方中心位置。圆圈的半径为10,填充颜色为none,边框颜色为蓝色和红色,边框宽度为2。两个圆圈之间使用一条黑色线连接,线的宽度为2。你可以根据需要修改圆圈的颜色、大小和位置,也可以修改线的颜色和宽度。
使用svg画两个小圆圈从上而下从圆的边界用一条线连接,圆圈和线的颜色都是粉色
好的,以下是使用SVG画两个小圆圈从上而下从圆的边界用一条线连接,圆圈和线的颜色都是粉色的代码:
```html
<svg width="100" height="100">
<circle cx="50" cy="25" r="10" fill="none" stroke="pink" stroke-width="2" />
<circle cx="50" cy="75" r="10" fill="none" stroke="pink" stroke-width="2" />
<line x1="50" y1="35" x2="50" y2="65" stroke="pink" stroke-width="2" />
</svg>
```
这个代码会在SVG区域内画一个粉色空心圆圈和一个粉色空心圆圈,分别位于SVG区域的上方和下方中心位置。圆圈的半径为10,填充颜色为none,边框颜色为粉色,边框宽度为2。两个圆圈之间使用一条粉色线连接,线的宽度为2,起点和终点分别在上下两个圆圈的边界处。你可以根据需要修改圆圈的颜色、大小和位置,也可以修改线的颜色和宽度。