|  |  | 
 |  |  | html,body,div { | 
 |  |  |     height: 100%; | 
 |  |  |     color: #2c3e50; | 
 |  |  | } | 
 |  |  | * { | 
 |  |  |     margin: 0; | 
 |  |  | } | 
 |  |  | body { | 
 |  |  |     display: grid; | 
 |  |  |     /*grid-template-columns:2fr 10fr ;*/ | 
 |  |  | } | 
 |  |  | /*头部*/ | 
 |  |  | .header { | 
 |  |  |     position: fixed; | 
 |  |  |     left: 0; | 
 |  |  |     top: 0; | 
 |  |  |     height: 60px; | 
 |  |  |     width: 100%; | 
 |  |  |     border-bottom: 1px solid #eaecef; | 
 |  |  |     z-index: 999; | 
 |  |  |     background-color: #ffffff; | 
 |  |  | } | 
 |  |  |  | 
 |  |  |  | 
 |  |  |  | 
 |  |  | /*侧边栏*/ | 
 |  |  | .siderbar { | 
 |  |  |     position: fixed; | 
 |  |  |     top: 60px; | 
 |  |  |     left: 0; | 
 |  |  |     width: 200px; | 
 |  |  |     border-right: 1px solid #eaecef; | 
 |  |  |     display: inline-block; | 
 |  |  |     float: left; | 
 |  |  |     cursor: pointer; | 
 |  |  | } | 
 |  |  |  | 
 |  |  |  | 
 |  |  | .main { | 
 |  |  |     width: auto; | 
 |  |  |     display: inline-block; | 
 |  |  |     float: right; | 
 |  |  |     margin-top: 3.6rem; | 
 |  |  | } | 
 |  |  | .main-box { | 
 |  |  |     max-width: 740px; | 
 |  |  |     margin: 0 auto; | 
 |  |  |     /*padding: 2rem 2.5rem;*/ | 
 |  |  |     /*border: 1px solid #eaecef;*/ | 
 |  |  | } | 
 |  |  | h2 { | 
 |  |  |     border-bottom: 1px solid #eaecef; | 
 |  |  |     padding-bottom: 4.8px; | 
 |  |  | } | 
 |  |  | h1,h2,h3,h4,h5,h6,p { | 
 |  |  |     margin: 30px auto; | 
 |  |  | } | 
 |  |  | h1 { | 
 |  |  |     padding-top: 4.6rem; | 
 |  |  |     margin-top: -1.6rem; | 
 |  |  | } | 
 |  |  | table { | 
 |  |  |     margin: auto; | 
 |  |  |     margin-top: 20px; | 
 |  |  |     max-width: 100%; | 
 |  |  |     min-width: 80%; | 
 |  |  |     border-collapse: collapse; | 
 |  |  |     border-spacing: 2px; | 
 |  |  |     border-color: grey; | 
 |  |  |     text-align: center; | 
 |  |  | } | 
 |  |  | table th { | 
 |  |  |     padding: 7px 5px; | 
 |  |  |     border: 1px solid #ccc; | 
 |  |  |     background-color: #EDEDED; | 
 |  |  | } | 
 |  |  | table td { | 
 |  |  |     padding: 5px 5px; | 
 |  |  |     border: 1px solid #ccc; | 
 |  |  | } | 
 |  |  | table tr:nth-child(2n-1) { | 
 |  |  |     background-color: #f8f8f8 | 
 |  |  | } | 
 |  |  | .code { | 
 |  |  |     height: auto; | 
 |  |  |     text-align: left; | 
 |  |  | } | 
 |  |  |  |