怎样实现这个效果呢，求解
中间画了一个圆，下边的这个半圆 怎样实现，求解
big_rock浏览 1659回答 2
2回答
-
成者并非一蹴而就
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Demo</title> <style> *{ border:0; padding:0; outline: 0; margin:0; }/*CSS SIMPLE RESET*/ .wrap{ position:relative; width:200px; height:200px; background: #FFF; border:5px solid #DDD; -webkit-border-radius: 100px; -moz-border-radius: 100px; -ms-border-radius: 100px; -o-border-radius: 100px; border-radius: 100px; overflow: hidden; } .child{ position:absolute; top:100px; width:200px; height:100px; background: rgba(153,70,10,.69);; -webkit-border-radius: 0 0 50px 50px; -moz-border-radius: 0 0 50px 50px; -ms-border-radius: 0 0 50px 50px; -o-border-radius: 0 0 50px 50px; border-radius: 0 0 50px 50px; } .child h3{ padding:20px; text-align: center; font-family: "微软雅黑"; font-size:12pt; color:rgba(255, 255, 255, 0.8);; } </style> </head> <body> <div> <div> <h3>收益完爆<br>普通理财</h3> </div> </div> </body> </html>放到firefox或者chrome看效果......两个圆嵌套就行了... -
big_rock
问题补充，定位里边套一个圆是不行的，因为不是半圆，想用两个折叠起来做，怎么做
随时随地看视频慕课网APP
CSS3
Html/CSS