国产 无码 综合区,色欲AV无码国产永久播放,无码天堂亚洲国产AV,国产日韩欧美女同一区二区

element-ui折疊面板怎么修改樣式

這篇具有很好參考價(jià)值的文章主要介紹了element-ui折疊面板怎么修改樣式。希望對(duì)大家有所幫助。如果存在錯(cuò)誤或未考慮完全的地方,請(qǐng)大家不吝賜教,您也可以點(diǎn)擊"舉報(bào)違法"按鈕提交疑問。

修改前

<div class="sidebar">
...
      <el-collapse v-model="activeName" accordion>
        ...
        <el-collapse-item name="3">
          <template slot="title">
            <i class="header-icon el-icon-s-goods"></i>商品管理
          </template>
          <div><i class="el-icon-menu"></i>商品列表</div>
          <div><i class="el-icon-menu"></i>分類參數(shù)</div>
          <div><i class="el-icon-menu"></i>商品分類</div>
        </el-collapse-item>
     	...
      </el-collapse>
    </div>

el-collapse樣式,前端,element-ui,前端,vue.js
因?yàn)榻M件封裝,要使用樣式穿透來修改…
注意需要把需要樣式穿透的類單獨(dú)拿出來,不能包裹在scss格式的類里了

<style lang="scss" scoped>
.sidebar{
	...
}
::v-deep .el-collapse-item__header{
          color: #fff;
          background-color: #313743 !important;
          position: relative;
        }
::v-deep .el-collapse-item__content{
          text-align: left;
          color: #fff ;
          background-color: #313743;
          padding-bottom: 0;
          div{
            height: .96rem;
            line-height: .96rem;
          }
        }
</style>

修改后
el-collapse樣式,前端,element-ui,前端,vue.js
展開…
el-collapse樣式,前端,element-ui,前端,vue.js
最后這個(gè)縫隙可以用邊框來填補(bǔ),至于偽類加橫杠最好不要用,因?yàn)檎归_和折疊的時(shí)候會(huì)出現(xiàn)一瞬間白線文章來源地址http://www.zghlxwxcb.cn/news/detail-517455.html

到了這里,關(guān)于element-ui折疊面板怎么修改樣式的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!

本文來自互聯(lián)網(wǎng)用戶投稿,該文觀點(diǎn)僅代表作者本人,不代表本站立場。本站僅提供信息存儲(chǔ)空間服務(wù),不擁有所有權(quán),不承擔(dān)相關(guān)法律責(zé)任。如若轉(zhuǎn)載,請(qǐng)注明出處: 如若內(nèi)容造成侵權(quán)/違法違規(guī)/事實(shí)不符,請(qǐng)點(diǎn)擊違法舉報(bào)進(jìn)行投訴反饋,一經(jīng)查實(shí),立即刪除!

領(lǐng)支付寶紅包贊助服務(wù)器費(fèi)用

相關(guān)文章

  • 自定義日歷.element-ui 修改時(shí)間選擇器樣式

    自定義日歷.element-ui 修改時(shí)間選擇器樣式

    目錄 一、自定義日歷 二、時(shí)間選擇樣式自定義 先上效果圖 已經(jīng)封裝成vue組件,可選擇切換年月: ?因 element-UI的時(shí)間選擇器 el-date-picker 是將元素直接掛載到頁面的 body 中,而非自身元素下,所以使用? /deep/、?、? ::v-deep? 等穿透無法定位到元素。 解決方案: 利用時(shí)間選擇

    2024年02月12日
    瀏覽(34)
  • vue修改element-ui日期下拉框datetimePicker的背景色樣式

    vue修改element-ui日期下拉框datetimePicker的背景色樣式

    在vue項(xiàng)目中,源datetimePicker的背景樣式,往往與項(xiàng)目背景不搭,需要修改。 ? 1.先在assets里面新建一個(gè)index.css文件來存儲(chǔ)全局樣式 2.在main.js里面導(dǎo)入這個(gè)css文件最后在里面加入我們想要的樣式 此時(shí)的效果如下圖 ? 3.在el-date-picker中設(shè)置樣式 4.設(shè)置對(duì)應(yīng)的背景樣式 得到下圖效果

    2024年02月11日
    瀏覽(100)
  • element-ui中 this.$confirm修改確定取消按鈕順序和樣式

    element-ui中 this.$confirm修改確定取消按鈕順序和樣式

    首先其他博客上說是給 this.$confirm中添加取消樣式,我試過了無效

    2024年02月14日
    瀏覽(33)
  • 【UI】 修改element-ui input輸入框placeholder提示信息、占位符的樣式

    【UI】 修改element-ui input輸入框placeholder提示信息、占位符的樣式

    如何修改 代碼如下: 效果 案例展示 vue2.x代碼 案例效果

    2024年02月15日
    瀏覽(25)
  • element-ui中Tooltip文字提示——el-tooltip的樣式修改

    注意 :以下修改都需要在全局樣式修改,因?yàn)檫@個(gè)組件的層級(jí),并不是在你使用他的地方,而是和你的app同一層級(jí),所以在當(dāng)前使用的地方找不到tip提示的dom節(jié)點(diǎn)。 修改提示框中長方形框的背景顏色 修改提示框中的小三角的邊框顏色

    2024年02月11日
    瀏覽(31)
  • element-ui日歷組件el-calendar選中特定時(shí)間以及樣式修改

    element-ui日歷組件el-calendar選中特定時(shí)間以及樣式修改

    項(xiàng)目開發(fā)中,有需要用到日歷的組件,而且需要把某些日期標(biāo)注起來,在這邊標(biāo)注的小紅點(diǎn)我用了 el-badge 具體效果如下圖所示: ?頁面標(biāo)簽: 變量聲明: 樣式修改: 參考地址

    2024年02月11日
    瀏覽(99)
  • 修改element-ui中的表格el-table的滾動(dòng)條樣式

    一.單獨(dú)修改element-ui中的表格el-table的滾動(dòng)條樣式(兩種方法) 1. 2. ?二.保持整個(gè)頁面的滾動(dòng)條的風(fēng)格是一致(直接改全局的滾動(dòng)條樣式) 三.頁面內(nèi)某一組件滾動(dòng)條樣式美化? scroll-bar是需要滾動(dòng)條組件的元素,類名自定義

    2024年02月11日
    瀏覽(31)
  • (Carousel)解決:Element-ui 中 Carousel 走馬燈的樣式的修改問題

    (Carousel)解決:Element-ui 中 Carousel 走馬燈的樣式的修改問題

    1、 Element-ui 提供組件情況: 其一、 Element-ui 自提供的代碼情況為(示例的代碼,例子如下): 代碼地址: https://element.eleme.cn/#/zh-CN/component/carousel 其二、頁面的顯示情況為: 1、 Carousel 自提供的代碼的實(shí)踐: 其一、代碼為: 其二、頁面展示為: 2、 Carousel 代碼相關(guān)屬性的使用

    2024年01月25日
    瀏覽(38)
  • Vue2+Element-UI的el-steps封裝與修改樣式
  • vue | element-ui中 如何修改表格Table組件中滾動(dòng)條的樣式

    在Table表格中,當(dāng)內(nèi)容超出容器時(shí)就會(huì)出現(xiàn)滾動(dòng)條,elemnt-ui自帶的滾動(dòng)條有時(shí)無法滿足需求,那么我們可以通過css偽類來實(shí)現(xiàn)對(duì)滾動(dòng)條的自定義。 滾動(dòng)條由兩部分組成的: 滑塊:可以滑動(dòng)的部分。 軌道:滾動(dòng)條的軌道,即滑塊的軌道。一般來說滑塊的顏色比軌道的顏色深一

    2024年02月11日
    瀏覽(40)

覺得文章有用就打賞一下文章作者

支付寶掃一掃打賞

博客贊助

微信掃一掃打賞

請(qǐng)作者喝杯咖啡吧~博客贊助

支付寶掃一掃領(lǐng)取紅包,優(yōu)惠每天領(lǐng)

二維碼1

領(lǐng)取紅包

二維碼2

領(lǐng)紅包