首页前端开发CSS使用CSS来创建平面图形代码

使用CSS来创建平面图形代码

时间2024-05-24 04:26:03发布访客分类CSS浏览109
导读:1.矩形 .rectangle { width: 250px; height: 150px; background-color: #6DC75F; } 2.三角形 .triangleUp { border-left: 75px solid...

1.矩形

.rectangle {

width: 250px;

height: 150px;

background-color: #6DC75F;

}

2.三角形

.triangleUp {

border-left: 75px solid transparent;

border-right: 75px solid transparent;

border-bottom: 150px solid #6DC75F;

width: 0;

height: 0;

}

3.椭圆形

.oval {

width: 300px;

height: 150px;

background: #6DC75F;

-moz-border-radius: 150px / 75px;

-webkit-border-radius: 150px / 75px;

border-radius: 150px / 75px;

}

4.月牙形

.moon {

width: 150px;

height: 150px;

border-radius: 50%;

box-shadow: 15px 15px 0 0 green;

}

5.树叶

.leaf {

border-radius: 5px 300px 3px 300px;

background: #6DC75F;

width: 150px;

height: 150px;

}

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!


若转载请注明出处: 使用CSS来创建平面图形代码
本文地址: https://pptw.com/jishu/666786.html
使用独立服务器的好处有哪些 租用游戏服务器要留意哪些问题

游客 回复需填写必要信息