css实现画圆
2022-08-14 本文已影响0人
诺喵
html代码
<body>
<div></div>
</body>
1.首先,我们创建一个div.
css代码
<style>
div {
margin: 100px auto;
width: 200px;
height: 200px;
border: 2px solid pink;
}
</style>
2.然后写下以上样式,设置宽高一致,加上2像素的实线、粉色边框,随个人喜好更改.不过我们现在得到的是一个粉色的正方形框框.
margin: 100px auto; 是指外边距向上向下距离100像素,左右均分.
加入样式
border-radius: 50%;
边框圆角:50%;
3.加上之后,我们就得到了一个粉色的圆啦！！
好了，今天分享到这，谢谢观看、查阅。
