<!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <style type="text/css"> body { border: none; margin: 0px; padding: 0px; text-align: center; } table { flex-align: center; text-align: center; border: 0px; border-spacing: 0px; border-collapse: collapse; 80%; margin: 0 auto; position: relative; } table thead tr { border: 0px; background: #F3FBFE; position: fixed; 80%; z-index: 1; } table thead tr::after { } table tbody { position: absolute; top: 50px; } table tbody tr { border: 0px; background: #FFF; } table tr td, table tr th { height: 50px; padding: 0px; border-spacing: 0px; margin: 0px; border: 1px solid red; 1%; } </style> <script src="js/jquery-1.11.1.min.js"></script> <script type="text/javascript"> $(function() { // $('#tablem tr').css('background', '#F3FBFE'); $('#tablem tr:not(:first)').mouseover(function() { $(this).css('background', '#C1E6FF').siblings().css('background', '#FFF'); }); }); </script> <body> <table id="tablem"> <thead> <tr> <th> 第一列 </th> <th> 第二列 </th> <th> 第三列 </th> <th> 第四列 </th> </tr> </thead> <tbody> <tr> <td>11</td> <td>12</td> <td>13</td> <td>14</td> </tr> <tr> <td>21</td> <td>22</td> <td>23</td> <td>24</td> </tr> <tr> <td>31</td> <td>32</td> <td>33</td> <td>34</td> </tr> <tr> <td>41</td> <td>42</td> <td>43</td> <td>44</td> </tr> <tr> <td>51</td> <td>52</td> <td>53</td> <td>54</td> </tr> <tr> <td>61</td> <td>62</td> <td>63</td> <td>64</td> </tr> <tr> <td>71</td> <td>72</td> <td>73</td> <td>74</td> </tr> <tr> <td>81</td> <td>82</td> <td>83</td> <td>44</td> </tr> <tr> <td>91</td> <td>92</td> <td>93</td> <td>94</td> </tr> <tr> <td>100</td> <td>100</td> <td>100</td> <td>100</td> </tr> <tr> <td>100</td> <td>100</td> <td>100</td> <td>100</td> </tr> <tr> <td>100</td> <td>100</td> <td>100</td> <td>100</td> </tr> <tr> <td>100</td> <td>100</td> <td>100</td> <td>100</td> </tr> <tr> <td>100</td> <td>100</td> <td>100</td> <td>100</td> </tr> <tr> <td>100</td> <td>100</td> <td>100</td> <td>100</td> </tr> <tr> <td>100</td> <td>100</td> <td>100</td> <td>100</td> </tr> <tr> <td>100</td> <td>100</td> <td>100</td> <td>100</td> </tr> </tbody> </table> </body> </html>