CSS画圆圈用线连接

画圆圈中间有数字1.2.3.之间用线连接

1画圆

.circle1_circle{/*border-radius: 50%;  */display: inline-block;width: 40px;height: 40px;background: #FFFFFF;border: 2px solid #05BBC9;box-sizing: border-box;border-radius: 27px;vertical-align: middle;
}

边框的弧度时画圆的关键 border-radius: 27px;可以改成
border-radius: 50%;
设置边框的颜色和粗细，圆就变成圆圈border: 2px solid #05BBC9;

2，圆里的数字

.circle1_1{display: block;text-align: center;width: 35px;height: 28px;font-family: PingFang SC;font-style: normal;font-weight: bold;font-size: 20px;line-height: 35px;vertical-align: middle;color: #05BBC9;
}

## 用线连接

  display: inline-block;width: 220px;/*transform: translate(200px,300px)rotate(0deg);*/transform-origin: center;height: 2px;left: 1029px;top: 342px;background: #D7E4E9;border-radius: 6px;
}

欢迎私信交流学习，感谢支持

【css画圆圈用线连接】相关推荐

简单的特效--css画圆圈
注释的代码是点击画圈圈,没有注释的是长按画圆圈(ps:是效果) <!DOCTYPE html> <html lang="en"> <head> ...
[css] 请使用CSS画一个带锯齿形边框圆圈
[css] 请使用CSS画一个带锯齿形边框圆圈 @import 个人简介我是歌谣,欢迎和大家一起交流前后端知识.放弃很容易, 但坚持一定很酷.欢迎大家一起讨论主目录与歌谣一起通关前端面试题
[css] 用css画出一个圆圈，里面有个对号
[css] 用css画出一个圆圈,里面有个对号 #right {width: 150px;height: 150px;margin: 100px auto;border-radius: 50%;bor ...
用css画出一个圆圈，里面有个叉号（不能用英文字母x）
用css画出一个圆圈,里面有个叉号(不能用英文字母x) #cyc {width: 150px;height: 150px;margin: 100px auto;border-radius: 50%;b ...
html画圆圈原理,用CSS画圆
我曾经向大家分享了一个非常巧妙的用纯CSS画三角形的技巧.在过去的一年里,我发现这种用CSS画三角形的技术非常的有用和高效,尤其是创建提示框/提示符等类似的网页效果上.另外一种也可以用CSS简单的实现 ...
css中怎么加入立体模型,CSS学习笔记二：css 画立体图形
继上一次学了如何去运用css画平面图形,这一次学如何去画正方体,从2D向着3D学习,虽然有点满,但总是一个过程,一点一点积累,然后记录起来. Transfrom3D 在这一次中运用到了一下几种属性: ...
图片画圈画箭头用什么软件_怎么在excel图片上画箭头 | 在excel里面怎样画圆圈里面有叉...
如何在excel表格数据上画圈插入--特殊符号--数字序号--自己找圆圈不是画的可能有其它方法,等高人用excel如何在阿拉伯数字数字上画圈试用一下区位码.Windows 自带区位码输入法, ...
如何用 css 画一个心形
如何用 css 画一个心形 (How to draw hearts using CSS) 用两个长方形切圆角倾斜位移并合并为一个心形第一步画一个长方形 (Draw a rectangle) 这个长 ...
html用css画多边形,Sass绘制多边形_Preprocessor, Sass, SCSS, clip-path, CSS处理器, 会员专栏教程_W3cplus...
CSS画图形在Web运用中时常看到,比如三角形.五角星,心形,Ribbon等.不过以前使用CSS绘制图形一般都是借助于border来绘制,但这样的方式受到一定的限制,而且实用价值也有所限制.这篇文章将 ...

【css画圆圈用线连接】

CSS画圆圈用线连接

1画圆

2，圆里的数字

## 用线连接

欢迎私信交流学习，感谢支持

【css画圆圈用线连接】相关推荐

最新文章

热门文章