欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

vue element-ui里的table中表頭與表格出現(xiàn)錯(cuò)位的解決

 更新時(shí)間:2022年08月24日 09:23:22   作者:khadijiah  
這篇文章主要介紹了vue element-ui里的table中表頭與表格出現(xiàn)錯(cuò)位的解決方案,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教

element-ui里的table中表頭與表格出現(xiàn)錯(cuò)位

現(xiàn)象:

原因:電腦顯示的縮放引起的,并且發(fā)現(xiàn)同為webkit內(nèi)核的Google瀏覽器和360瀏覽器中360瀏覽器顯示正常,而Google瀏覽器才會(huì)出現(xiàn)這個(gè)問題。

解決方案

找到項(xiàng)目入口文件(敲黑板重點(diǎn)?。。砑尤謽邮剑?/p>

.el-table th.gutter{
    display: table-cell!important;
}

效果:

看著順眼多了吧~

element-ui表格樣式錯(cuò)亂調(diào)整方式

在vue中封裝了element-ui表格,然后使用插槽,fixed定位等,導(dǎo)致樣式出現(xiàn)了錯(cuò)亂,以下提供幾種錯(cuò)亂方式的解決方法

1、線沒有對(duì)齊

在全局樣式中寫下這樣的代碼

/* Element-UI 的table 組件出現(xiàn)表格線條不對(duì)齊的問題 */
body .el-table th.gutter {
    display: table-cell !important
}

2、fixed固定導(dǎo)致的高度問題

全局樣式中寫如下代碼

.el-table__fixed-right{
    height: 100% !important;
}

3、去掉鼠標(biāo)hover修改背景色事件

/* 去掉鼠標(biāo)hover事件 */
/* tr {
    pointer-events: none;
} */

以上為個(gè)人經(jīng)驗(yàn),希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。 

相關(guān)文章

  • Vue路由切換和Axios接口取消重復(fù)請(qǐng)求詳解

    Vue路由切換和Axios接口取消重復(fù)請(qǐng)求詳解

    在web項(xiàng)目開發(fā)的過程中,經(jīng)常會(huì)遇到客服端重復(fù)發(fā)送請(qǐng)求的場(chǎng)景,下面這篇文章主要給大家介紹了關(guān)于Vue路由切換和Axios接口取消重復(fù)請(qǐng)求的相關(guān)資料,需要的朋友可以參考下
    2022-05-05
  • vue控制多行文字展開收起的實(shí)現(xiàn)示例

    vue控制多行文字展開收起的實(shí)現(xiàn)示例

    這篇文章主要介紹了vue控制多行文字展開收起的實(shí)現(xiàn)示例(也叫控制文字展開隱藏),文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2019-10-10
  • vue elementui tree 任意級(jí)別拖拽功能代碼

    vue elementui tree 任意級(jí)別拖拽功能代碼

    這篇文章主要介紹了vue elementui tree 任意級(jí)別拖拽功能代碼,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
    2020-08-08
  • Vue3?使用v-model實(shí)現(xiàn)父子組件通信的方法(常用在組件封裝規(guī)范中)

    Vue3?使用v-model實(shí)現(xiàn)父子組件通信的方法(常用在組件封裝規(guī)范中)

    這篇文章主要介紹了Vue3?使用v-model實(shí)現(xiàn)父子組件通信(常用在組件封裝規(guī)范中)的方法,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),感興趣的朋友跟隨小編一起看看吧
    2024-06-06
  • 詳解vue-cli多頁面工程實(shí)踐

    詳解vue-cli多頁面工程實(shí)踐

    本篇文章主要介紹了詳解vue-cli多頁面工程實(shí)踐,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧
    2017-08-08
  • Vue中子組件調(diào)用父組件的3種方法實(shí)例

    Vue中子組件調(diào)用父組件的3種方法實(shí)例

    vue子組件調(diào)用父組件的方法其實(shí)不難,最近整理了一下,下面這篇文章主要給大家介紹了關(guān)于Vue中子組件調(diào)用父組件的3種方法,需要的朋友可以參考下
    2022-05-05
  • iView UI FORM 動(dòng)態(tài)添加表單項(xiàng)校驗(yàn)規(guī)則寫法實(shí)例

    iView UI FORM 動(dòng)態(tài)添加表單項(xiàng)校驗(yàn)規(guī)則寫法實(shí)例

    這篇文章主要為大家介紹了iView UI FORM 動(dòng)態(tài)添加表單項(xiàng)校驗(yàn)規(guī)則寫法實(shí)例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
    2023-01-01
  • vue的常用組件操作方法應(yīng)用分析

    vue的常用組件操作方法應(yīng)用分析

    這篇文章主要介紹了vue的常用組件操作方法應(yīng)用分析,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下
    2018-04-04
  • 在vue2?中使用?tailwindcss的方法?親測(cè)可用

    在vue2?中使用?tailwindcss的方法?親測(cè)可用

    這篇文章主要介紹了在vue2?中使用?tailwindcss的方法?親測(cè)可用,本文分步驟給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
    2022-07-07
  • vue實(shí)現(xiàn)前進(jìn)刷新后退不刷新效果

    vue實(shí)現(xiàn)前進(jìn)刷新后退不刷新效果

    這篇文章主要介紹了vue實(shí)現(xiàn)前進(jìn)刷新,后退不刷新效果,即加載過的界面能緩存起來(返回不用重新加載),關(guān)閉的界面能被銷毀掉(再進(jìn)入時(shí)重新加載)。本文給大家分享實(shí)現(xiàn)思路,需要的朋友可以參考下
    2018-01-01

最新評(píng)論