css制作的圆,三角形,椭圆,箭头图标

圆:

  1. .yuan{    width:100px;    height:100px;    -moz-border-radius:50%;     -webkit-border-radius:50%;     border-radius:50%;     background-color:red;}

登录后复制

css制作的圆,三角形,椭圆,箭头图标

椭圆

  1. .oval {     width: 200px;     height: 100px;     background-color: red;     -moz-border-radius: 100px / 50px;     -webkit-border-radius: 100px / 50px;     border-radius: 100px / 50px; }

登录后复制

css制作的圆,三角形,椭圆,箭头图标

箭头:

  1. .arrow{    content: '';    position: absolute;    width: 30px;    height: 30px;    border: 10px solid #f5b24a;    -webkit-transform: rotate(-135deg);    -moz-transform: rotate(-135deg);    -o-transform: rotate(-135deg);    -ms-transform: rotate(-135deg);    transform: rotate(-135deg);    border-top: none;    border-right: none;    top: 9px;}

登录后复制

css制作的圆,三角形,椭圆,箭头图标

三角形:

  1. .rencentle {    width: 0;    height: 0;    border-left: 50px solid transparent;    border-right: 50px solid transparent;    border-bottom: 100px solid red;}

登录后复制

css制作的圆,三角形,椭圆,箭头图标

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
编程技术

select下拉框多选的实现

2025-3-29 14:34:26

编程技术

css3 气泡对话框实例

2025-3-29 14:34:34

0 条回复 A文章作者 M管理员
欢迎您,新朋友,感谢参与互动!
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
私信列表
搜索