播放按钮常见形式为三角形，CSS绘制三角形主要用到了border-width属性，他可以定义四个边框各个的宽度。
播放样式代码：
button{padding: 0;background-color: white;box-sizing: border-box;}.play{height: 74px;border-style: solid;border-width: 37px 0 37px 60px;border-color: transparent transparent transparent black;}
效果：
暂停按钮常见样式为两个竖线，实现这个效果用到了border-style的一个属性值double，意为双边框
暂停按钮样式代码：
button{padding: 0;background-color: white;box-sizing: border-box;}.pause{width: 74px;height: 74px;border-style: double;border-width: 0px 0px 0px 60px;border-color: #20;}
效果：
鼠标悬浮切换按钮样式：
button{padding: 0;background-color: white;box-sizing: border-box;}.play{height: 74px;border-style: solid;border-width: 37px 0 37px 60px;border-color: transparent transparent transparent black;transition: all .5s ease;}.play:hover{border-style: double;border-width: 0px 0px 0px 60px;}
效果：
使用CSS不仅可以绘制三角形，还有很多常见图形，可参考：/css/css-simple-shapes-cheat-sheet
代码地址：/justforuse/HTML-CSS-JS/tree/master/play-pause
参考链接： https://css-/making-pure-css-playpause-button/
