HTML+CSS3设置圆角边框、圆形

 时间:2024-10-15 21:14:21

1、打开自己的网页编辑器新建HTML文件模板

HTML+CSS3设置圆角边框、圆形

2、编写第一种常用的圆角样式:同时设置四个角为圆角HTML代码:<div class="demo1"></div>CSS代码:width: 200px; height: 50px; background-color: crimson; border-radius: 15px;

HTML+CSS3设置圆角边框、圆形

3、编写第二种常用的圆角样式:设置任意角为圆角HTML代码:<div class="demo2"></div>CSS代码:width: 200px; height: 50px; background-color: crimson; border-radius: 20px 50px 20px 50px;

HTML+CSS3设置圆角边框、圆形

4、编写第三种常用的圆角样式:圆形HTML代码:<div class="demo2"></div>CSS代码:width: 200px; height: 200px; background-color: crimson;border-radius: 50%;

HTML+CSS3设置圆角边框、圆形

5、编写第四种常用的圆角样式:椭圆HTML代码:<div class="demo4"></div>CSS代码:width: 200px; height: 150px; background-color: crimson;border-radius: 50px/75px;

HTML+CSS3设置圆角边框、圆形

6、编写第四种常用的圆角样式:单独设置某一个角HTML代码:<div class="demo5"></div>CSS代码:width: 200px; height: 150px; background-color: crimson;border-top-left-radius: 20px; border-top-right-radius: 40px; border-bottom-right-radius: 30px; border-bottom-left-radius: 50px;

HTML+CSS3设置圆角边框、圆形
  • 如何用HTML编写计算器
  • PPT2019怎么切换为黑色视图模式
  • 如何用C语言输出字母塔
  • 冒险岛2空间裂痕怎么进入及技巧
  • 在access中创建数据表
  • 热门搜索
    保护树木的手抄报 法律知识手抄报资料 小学英语手抄报大全 手抄报标题艺术字 手抄报标题设计 教师节手抄报内容大全 校园安全手抄报图片 有关中国梦的手抄报 关于礼仪的手抄报 创建文明城手抄报