Html
    Css
    Js

    
                        
* {
	margin:0;
	padding:0;
}
body {
	background:#ccc;
}
.balloon {
	width:160px;
	height:160px;
	border-radius:80px 80px 20px 80px;
	/* 圆角 左上 右上 右下 左下*/
			background:#fff;
	transform:rotate(45deg);
	/* 旋转45度*/
			box-shadow:-8px -8px 80px -8px #873940 inset;
	/* 盒子阴影*/
			position:absolute;
}
.balloon::after {
	/*伪元素*/
			content:'';
	/*激活伪元素*/
			position:absolute;
	bottom:0;
	right:0;
	width:0;
	height:0;
	border:8px solid transparent;
	border-right-color:#873940;
	transform:rotate(45deg);
	/* 旋转45度*/
			border-radius:16px;
}

                        
↑上面代码改变,会自动显示代码结果 jQuery调用版本:1.11.3
 立即下载

气球飞天特效

1
      恬恬~0
      2017/8/7 15:12:23
      气球太大了,但是不知道怎么编辑再提交上去。来不及点击都飞没了 回复