`審核人：白占寧` `被審核代碼負責人：謝洋` `代碼地址：http://192.168.1.170/hyfe/demo-project/tree/master/demo-xieyang` ### 存在的問題 #### 1、功能問題 -復選框不能選中 ``` <td><div class="chk"></div></td> ``` 解決方案：使用CheckBox，或點擊時候添加選中效果。 #### 2、功能問題-滾動條位置 頭部和左邊導航欄位置固定不動，當內容太多時候，只內容區添加滾動條即可。 #### 3、功能問題-兼容性 IE11下，分頁組件樣式混亂。 #### 4、HTML結構優化 ``` <div class="page-box"> <span>每頁</span> <select> <option value="6">6</option> <option value="10">20</option> <option value="10">30</option> <option value="10">40</option> </select> <span>條 / 共</span> <span class="c">58</span> <span>條記錄</span> <button class="ml10">首頁</button> <button>上頁</button> <span class="c">1</span> <span> / 20頁</span> <button class="ml10">下頁</button> <button>尾頁</button> <span class="ml10">跳轉</span> <input type="text" value="5"> <button>確定</button> </div> ``` 解決方案：根據不同功能，分成各個組來布局，如下： ``` <div class="page-box"> <div class="select-page"></div> <div class="btn-page"></div> <div class="submit-page"></div> </div> ``` ####5、避免使用`!important` ``` body { width: 100% !important; height: auto !important; overflow: auto !important; min-width: 700px; } ``` #### 6、代碼可讀性 ``` @mixin gradient-top-to-bottom($startColor, $endColor) { filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#{$startColor}, endcolorstr=#{$endColor}, gradientType=0); -ms-filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#{$startColor}, endcolorstr=#{$endColor}, gradientType=0); background: $startColor; background: -moz-linear-gradient(top, $startColor, $endColor); background: -webkit-gradient(linear, 0 0, 0 bottom, from($startColor), to($endColor)); background: -o-linear-gradient(top, $startColor, $endColor); } ``` 解決方案：適當的換行，建議每行字符不超過80個。