SOURCE

			<div class="button">
					<div class="button-text">一个按钮背后的故事</div>
			</div>

	* {  /*修改盒子模型计算方式*/
						-webkit-box-sizing: border-box;
							 -moz-box-sizing: border-box;
										box-sizing: border-box;
					}
				 .button{
							position: relative;
							height: 200px;
							width: 400px;
							margin: 50px;
							padding:10px; 
							/*设置透视效果*/
							perspective:100; 
							-webkit-perspective:100; /* Safari and Chrome */
							border:solid 1px black; 
					}
					.button-text{ /*按钮文本*/
							background-color: rgb(242, 13, 13); 
							height: 44px;
							line-height: 44px;
							min-width: 320px;
						  border-radius:44px;
							text-align: center;
							color: #fff;  
							background-color: red; 
							transform: rotateX(45deg);
							-webkit-transform: rotateX(45deg); /* Safari and Chrome */
					}