css中把正方形变成圆形的方法

发布时间:2020-12-31 13:50:09 作者:小新
来源:亿速云 阅读:429

这篇文章主要介绍css中把正方形变成圆形的方法,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!

css中把正方形变成圆形的方法:首先新建一个html示例文件;然后在body标签中输入div标签,并且给div标签添加一个类名;最后通过添加属性为“border-radius:150px”即可把正方形变成圆形。

新建一个 将正方形变成圆形.html 文件,如图所示:

css中把正方形变成圆形的方法

输入HTML5的结构代码,将title标签里面的内容修改成:将正方形变成圆形,如图所示:

css中把正方形变成圆形的方法

在body标签中输入div标签,并且给div标签添加一个类名(box),如图所示:

css中把正方形变成圆形的方法

给类名(box)添加CSS属性,让其变成一个正方形,如图所示:

css中把正方形变成圆形的方法

添加一个CSS属性,代码:border-radius:150px,如图所示:

css中把正方形变成圆形的方法

运行网页,可以看到正方形已经变成了圆形,如图所示:

css中把正方形变成圆形的方法

以上是“css中把正方形变成圆形的方法”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注亿速云行业资讯频道!

推荐阅读:
  1. css把纵向排列变成横向的方法
  2. 使用纯CSS实现圆形图像的方法

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

css

上一篇:css图片不让选中状态怎么实现

下一篇:邮件不支持css的解决方法

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》