好看的按钮

transparent:
指定全透明色彩. transparent 是全透明黑色（back）的速记法。类似rgb的值。（看不见哦！）

  <style>
          .div4 {
              width: 144px;
              height: 30px;
              line-height: 30px;
              background-color: #162e48;
              color: #fff;
              text-align: center;
              margin: 100px auto;
          }

          .div4-1,
          .div4-2 {
              width: 86px;
              float: left;
          }

          .div4-1.active {
              margin-right: -28px;
              background: linear-gradient(-135deg, transparent 20px, #f00 0);
          }

          /* .div4-2.active {
              margin-right: -28px;
              background: linear-gradient(45deg, transparent 20px, #f00 0);
          } */
 </style>


  <div class="div4">
          <div class="div4-1 active">ON</div>
          <div class="div4-2 active">OFF</div>
   </div>