原来border有这么多种类前端这么久，以为border只有solid,dashed,dotted三种。其实不然。

前端这么久，以为border只有solid,dashed,dotted三种。其实不然。

<!DOCTYPE >
<html lang="en"><head>  <meta charset="UTF-8">  
  <meta name="viewport" content="width=device-width, initial-scale=1.0">  
  <meta http-equiv="X-UA-Compatible" content="ie=edge">  
  <title>Document</title>  
  <style>    
     /* 定义表格外观 */   
      table {        
        border-width: 3px;        
        background-color: #52E396;    
      }   
      tr, td {        
        padding: 2px;    
      }    
      /* border-style 示例 */    
      .b1 {border-style:none;}    
      .b2 {border-style:hidden;}    
      .b3 {border-style:dotted;}    
      .b4 {border-style:dashed;}    
      .b5 {border-style:solid;}    
      .b6 {border-style:double;}    
      .b7 {border-style:groove;} /*默认灰色*/    
      .b8 {border-style:ridge;}    
      .b9 {border-style:inset;}    
      .b10 {border-style:outset;}  
    </style>  
   </head>
   <body>    
    <table>        
        <tr>            
            <td class="b1">none</td>            
            <td class="b2">hidden</td>            
            <td class="b3">dotted</td>            
            <td class="b4">dashed</td>        
        </tr>        
        <tr>            
            <td class="b5">solid</td>            
            <td class="b6">double</td>            
            <td class="b7">groove</td>            
            <td class="b8">ridge</td>        
        </tr>       
        <tr>            
            <td class="b9">inset</td>            
            <td class="b10">outset</td>        
        </tr>    
      </table>
     </body>
   </html>

结果：