使用CSS3绘制同心圆的实例代码
基本思路首先，你必须画三个圆，三个圆圈是如何重叠成一块的这必须由保证金控制。
CSS
{ # T1
浮点数：左；
宽度：150px；
身高：150px；
背景：粉红色；
边界半径：75px；
}
{ # T2
浮点数：左；
宽度：100px；
身高：100px；
margin-left: - 125px； / *左移125px * /
保证金：25px顶部移到底部25px * / / *；
背景：绿色；
边界半径：50px；
}
{ # T3
浮点数：左；
宽度：50px；
身高：50px；
margin-left: - 100px； / * * /左移100px
边距：50px；
背景：黄色；
Border-radius: 25px;
}
结果
代码分析
你如何理解上面的代码左边界为例，：- 125 px的T2。缘上：25px；看下面的图
- 125代表左移125px，和25代表25px向下运动。为什么要让移动125px这是在你的初中数学你做了什么。两中心之间的距离，大的圆的半径是75px，和圆的半径为50px的。也就是说，大循环和小循环之间的距离125px。
对25px垂直方向的中心的垂直距离25px。
总结
了解边距值的移动方向！
以上就是本文的全部内容。希望本文的内容能给大家的学习或工作带来一定的帮助。如果有任何疑问，可以留言交流，谢谢您的支持。