怎样在网页画圆(网页设计)

 时间:2024-10-24 20:51:43

1、首页,新建HTML文件之后,在里面先写上<div></div>标签。

怎样在网页画圆(网页设计)

2、然后,对之前的<div></div>标签设计css样式,定义div的宽度和高度以及它的背景色。

怎样在网页画圆(网页设计)

3、接着预览一下,可以看到一个正方体,因为我定义的宽高比较小,具体可以自己定义宽高。

怎样在网页画圆(网页设计)

4、接着我们给div加上边框,就是border:1px solid blue;分别是边框的宽度,样式以及边框的颜色。

怎样在网页画圆(网页设计)

5、接着就是最关键的了,在css中写上border-radius:50%;div就会由原来的正方体变成了圆形。

怎样在网页画圆(网页设计)

6、接着保存之后再在网页中预览一下效果,变成了一个蓝色的圆形。

怎样在网页画圆(网页设计)

7、如果把背景色去掉的话就会得到一个白色的圆,记得一定要加边框border哟!

怎样在网页画圆(网页设计)
  • html轮播图怎么制作
  • 如何在html中制作圆角矩形
  • HTML网页怎么设置竖排文字
  • html 如何添加背景音乐
  • html如何把两个网页连接起来
  • 热门搜索
    初一历史手抄报 构建和谐校园手抄报 教师节手抄报花边 祖国发展我成长手抄报 手抄报花边又漂亮 勤俭廉政手抄报内容 清明节手抄报图片简单 书香校园手抄报资料 关于三月三的手抄报 消防手抄报资料