简单的按钮样式,两个连在一起的按钮

样式效果:

<div class="btnBox">
  <button class="btn btn1">白名单用户</button>
  <button class="btn btn2">黑名单用户</button>
 </div>


<style type="text/css">
  .btnBox{
   display: flex;
   flex-direction: row;
   flex-wrap: nowrap;
  }
  .btn{
   width: 80px;
   height: 30px;
   line-height: 30px;
   text-align: center;
   font-size: 12px;
   background-color: #fff;
  }
  .btn1{
   border: 1px solid #0382FF;
   color: #0382FF;
  }
  .btn2{
   border: 1px solid #eee;
   color: #666;
  }
 </style>
原文地址:https://www.cnblogs.com/njccqx/p/13206068.html