css 播放器按钮实现

 //播放按钮

		<div id="playBtn" class="circle" style="margin: 20px 0px 10px 20px;">

			<div class="circle_inner_play">

			</div>

		</div>

//暂停按钮

		<div id="pauseBtn" class="circle" style="margin: 20px 0px 10px 85px;">

			<div class="circle_inner_pause">

				▐▐

			</div>

		</div>

//重置按钮

		<div id="resetBtn" class="circle" style="margin: 20px 0px 10px 150px;">

			<div class="circle_inner_reset">

			</div>

		</div>

                .circle {

				border: solid 1px #23527C;

				border-radius: 50px;

				height: 50px;

				position: absolute;

				width: 50px;

			}

			.circle:hover {

				transform: scale(1.1);

				-webkit-transform: scale(1.1);

				-moz-transform: scale(1.1);

			}

			.circle_inner_play {

				content: "";

				display: block;

				width: 0;

				height: 0;

				border-style: solid;

				border-width: 10px 0 10px 20px;

				border-color: transparent transparent transparent #23527C;

				position: absolute;

				top: 50%;

				left: 50%;

				margin: -10px 0 0 -7px;

			}

			.circle_inner_pause {

				position: absolute;

				top: 50%;

				left: 50%;

				margin-left: -12px;

				margin-top: -10px;

				color: #23527C;

			}

			.circle_inner_reset {

				width: 18px;

				height: 18px;

				background-color: #23527C;

				margin: -9px 0 0 -9px;

				position: absolute;

				top: 50%;

				left: 50%;

			}