<div class="table" > <div class="body"> <h4 class="title"> <span class="label">表2-1</span><span class="caption">某年某</span> </h4> <table class="table"> <tbody> <tr> <th></th> <th>122</th> <th>222</th> </tr> <tr> <td>a</td> <td>18</td> <td>200</td> </tr> <tr> <td>b</td> <td>19</td> <td>150</td> </tr> <tr> <td>c</td> <td>20</td> <td>100</td> </tr> <tr> <td>d</td> <td>21</td> <td>75</td> </tr> <tr> <td>e</td> <td>22</td> <td>50</td> </tr> </tbody> </table> </div> </div>
input{ outline:none !important; } //只复制.box-table 下的就可以,下面是定义其他按钮的 .table input[type="radio"], input[type="radio"], .radio input[type="radio"], .radio-inline input[type="radio"] { position: relative; margin-top: 3px; margin-right: 4px; vertical-align: top; border: none; background-color: transparent; -webkit-appearance: none; appearance: none; cursor: pointer; } .table input[type="radio"]:before, input[type="radio"]:before, .radio input[type="radio"]:before, .radio-inline input[type="radio"]:before { position: absolute; left: 0; /*top: -3px;*/ background-color: #2196f3; -webkit-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); } .table input[type="radio"]:after, input[type="radio"]:after, .radio input[type="radio"]:after, .radio-inline input[type="radio"]:after { position: relative; top: -3px; border: 2px solid #666666; content: ""; display: block; width: 18px; height: 18px; border-radius: 50%; -webkit-transition: 240ms; -o-transition: 240ms; transition: 240ms; } .table input[type="radio"]:after, .table input[type="radio"]:before, input[type="radio"]:before, .radio input[type="radio"]:before, .radio-inline input[type="radio"]:before, input[type="radio"]:after, .radio input[type="radio"]:after, .radio-inline input[type="radio"]:after { content: ""; display: block; width: 18px; height: 18px; border-radius: 50%; -webkit-transition: 240ms; -o-transition: 240ms; transition: 240ms; } .table input[type="radio"]:after, .table input[type="radio"]:before, .table input[type="radio"]:after{ width: 15px; height: 15px; border-radius: 0; } .table input[type="radio"]:checked:before, input[type="radio"]:checked:before, .radio input[type="radio"]:checked:before, .radio-inline input[type="radio"]:checked:before { -webkit-transform: scale(.5); -ms-transform: scale(.5); -o-transform: scale(.5); transform: scale(.5); } .table input[type="radio"]:checked:after, input[type="radio"]:checked:after, .radio input[type="radio"]:checked:after, .radio-inline input[type="radio"]:checked:after { border-color: #2196f3; }