abp(net core)+easyui+efcore實作倉儲管理系統目錄
abp(net core)+easyui+efcore實作倉儲管理系統——ABP總體介紹(一）
abp(net core)+easyui+efcore實作倉儲管理系統——解決方案介紹(二)
abp(net core)+easyui+efcore實作倉儲管理系統——領域層創建物體(三)
abp(net core)+easyui+efcore實作倉儲管理系統——定義倉儲并實作 (四)
abp(net core)+easyui+efcore實作倉儲管理系統——創建應用服務（五）
abp(net core)+easyui+efcore實作倉儲管理系統——展現層實作增刪改查之控制器（六）
abp(net core)+easyui+efcore實作倉儲管理系統——展現層實作增刪改查之串列視圖（七）
abp(net core)+easyui+efcore實作倉儲管理系統——展現層實作增刪改查之增刪改視圖（八）
abp(net core)+easyui+efcore實作倉儲管理系統——展現層實作增刪改查之選單與測驗（九）
abp(net core)+easyui+efcore實作倉儲管理系統——多語言（十）
abp(net core)+easyui+efcore實作倉儲管理系統——使用 WEBAPI實作CURD (十一)
abp(net core)+easyui+efcore實作倉儲管理系統——選單-上 (十六)
abp(net core)+easyui+efcore實作倉儲管理系統——EasyUI前端頁面框架 (十八)
abp(net core)+easyui+efcore實作倉儲管理系統——EasyUI之貨物管理一 (十九)
abp(net core)+easyui+efcore實作倉儲管理系統——EasyUI之貨物管理二 (二十)
abp(net core)+easyui+efcore實作倉儲管理系統——EasyUI之貨物管理三 (二十一) abp(net core)+easyui+efcore實作倉儲管理系統——EasyUI之貨物管理四 (二十二)現在我們已經實作了我們想要實作的功能，但是這些功能還不完美，如果是細心的讀者，在看上一篇文章（abp(net core)+easyui+efcore實作倉儲管理系統——EasyUI之貨物管理四 (二十二) ）時會發現一些我們需要的復選框并沒有出現在我們想要它出現的位置，如下圖中紅框處，我們想要出現一個復選框，但實作上卻沒有出現，下面我們來解決這個問題，
十四、樣式沖突
1. 首先，我們在Visual Studio 2017中按F5運行應用程式，
2.在瀏覽器中的地址欄中輸入“http://localhost:5000/”，然后輸入管理員用戶名進行登錄，
3.在主界面的選單中，選擇“Business->貨物管理”選單項，瀏覽器中呈現一個貨物資訊串列與四個按鈕，如下圖，你會發現這個串列有問題，如下圖紅框處，沒有復選框，
4.我們在瀏覽器(Firefox)在復選框的位置，使用單擊滑鼠右鍵，在彈出選單中選中“查看元素”，如下圖，然后我們看到在html代碼中是有復選框的相關代碼的，但是卻沒有在頁面中顯示，我們來看一下這個復選框的樣式，如下圖中的紅框處，原來checkbox元素的樣式表沖突了，此處的Checkbox元素的樣式并不是我們想要的是EasyUI.css中的樣式定義，而實際上卻使用了materialize.css樣式表中的樣式定義，造成了這個Checkbox元素左移了-9999px像素，變的不可見了，
5. 知道了問題原因，我們可以直接在Firefox除錯器中修改一下樣式，把樣式中的left的值由-9999px修改為1px，opacity的值由0改為2，如下圖紅框處，然后我們需要的復選框就出現在我們想要的位置，如下圖，
6. 那應該如何來解決這個問題呢？仔細觀察除錯器中的HTML代碼，發現Checkbox外面還有一層DIV，這行DIV的class名稱為“datagrid-cell-check”，這個發現，我們就有辦法解決這個樣式沖突問題了，在Visual Studio 2017的“解決方案資源管理器”中，找到“ABP.TPLMS.Web.MVC”專案的“wwwroot\lib\easyui-1.8\themes\bootstrap”檔案夾中找到easyui.css檔案，在這個檔案中添加如下樣式，代碼如下，
.datagrid-header-check input[type=checkbox], .datagrid-cell-check input[type=checkbox] { position: absolute; left: 5px; opacity: 1; margin: 0; padding: 0; width: 15px; height: 18px; }
7.在瀏覽器中先訪問一下其他頁面，然后再來訪問貨物資訊串列，此時串列的復選框出現了，如下圖，
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/103579.html
標籤：.NET Core