css3无限气泡,CSS3 border-radius实现气泡对话框效果

CSS代码：

.test{

width:300px;

padding:80px 20px;

margin-left:100px;

background:#beceeb;

-webkit-border-top-left-radius:220px 120px;

-webkit-border-top-right-radius:220px 120px;

-webkit-border-bottom-right-radius:220px 120px;

-webkit-border-bottom-left-radius:220px 120px;

-moz-border-radius:220px / 120px;

border-radius:220px / 120px;

position:relative;

}

.test span{width:0; height:0; font-size:0; background:#beceeb; overflow:hidden; position:absolute;}

.test span.bot{

width:30px;

height:30px;

-moz-border-radius:30px;

-webkit-border-radius:30px;

border-radius:30px;

left:10px;

bottom:-20px;

}

.test span.top{

width:15px;

height:15px;

-moz-border-radius:15px;

-webkit-border-radius:15px;

border-radius:15px;

left:0px;

bottom:-40px;

}

HTML代码：

CSS3 border-radius实现气泡对话框效果