溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
本文小編為大家詳細介紹“vue表頭錯位如何解決”，內容詳細，步驟清晰，細節(jié)處理妥當，希望這篇“vue表頭錯位如何解決”文章能幫助大家解決疑惑，下面跟著小編的思路慢慢深入，一起來學習新知識吧。
vue表頭錯位的解決辦法：1、找到項目入口文件，添加全局樣式為“.el-table th.gutter{display: table-cell!important;}”；2、在全局樣式中寫入代碼為“body .el-table th.gutter {display: table-cell !important}”；3、去掉鼠標hover修改背景色事件。
vue element-ui里的table中表頭與表格出現(xiàn)錯位的解決
現(xiàn)象：
原因：電腦顯示的縮放引起的，并且發(fā)現(xiàn)同為webkit內核的Google瀏覽器和360瀏覽器中360瀏覽器顯示正常，而Google瀏覽器才會出現(xiàn)這個問題。
找到項目入口文件（敲黑板重點?。。?，添加全局樣式：
.el-table th.gutter{
display: table-cell!important;
}
效果：
看著順眼多了吧～
在vue中封裝了element-ui表格，然后使用插槽，fixed定位等，導致樣式出現(xiàn)了錯亂，以下提供幾種錯亂方式的解決方法
在全局樣式中寫下這樣的代碼
/* Element-UI 的table 組件出現(xiàn)表格線條不對齊的問題 */
body .el-table th.gutter {
display: table-cell !important
}
全局樣式中寫如下代碼
.el-table__fixed-right{
height: 100% !important;
}
/* 去掉鼠標hover事件 */
/* tr {
pointer-events: none;
} */讀到這里，這篇“vue表頭錯位如何解決”文章已經介紹完畢，想要掌握這篇文章的知識點還需要大家自己動手實踐使用過才能領會，如果想了解更多相關內容的文章，歡迎關注億速云行業(yè)資訊頻道。
免責聲明：本站發(fā)布的內容（圖片、視頻和文字）以原創(chuàng)、轉載和分享為主，文章觀點不代表本網(wǎng)站立場，如果涉及侵權請聯(lián)系站長郵箱：is@yisu.com進行舉報，并提供相關證據(jù)，一經查實，將立刻刪除涉嫌侵權內容。
