我知道用/deep/,但是我試了一下el-tooltip出來的顏色一直是默認的黑色
想知道改變背景顏色的格式是什么
.aaa /deep/ .el-tooltip__popper
{
background: #1ab394 !important;
}
aaa是我自己定義的el-tooltip的class名字
我是用這種方式寫的 但是還是不改變背景顏色
有沒有老哥教一下或者指出我的錯誤
uj5u.com熱心網友回復：
>>>外層 >>> 第三方組件 {
樣式
}
試試
uj5u.com熱心網友回復：
不行就把這個寫到css檔案里面去
.aaa .el-tooltip__popper
{
background: #1ab394 !important;
}
uj5u.com熱心網友回復：
<el-tooltip class="item123" effect="dark" content="Top Left 提示文字" placement="top-start">
<button>11111 </button>
</el-tooltip>
.item123 >>> .el-tooltip__popper{
background: blueviolet!important;
}
還是沒有效果，但是我試過不用el-tooltip用其他的element組件我是可以改變他們的樣式 就是這個tooltip我改變不了背景顏色
uj5u.com熱心網友回復：
.item dom 等于 .el-tooltip__popper domitem123 >>> .el-tooltip__popper 這個有什么意義?
item123要是.el-tooltip__popper的父級
uj5u.com熱心網友回復：
那我該怎么寫才能改變el-tooltip的背景顏色啊能不能舉個例子
uj5u.com熱心網友回復：
<div class="item123">
<el-tooltip effect="dark" content="Top Left 提示文字" placement="top-start">
<button>11111 </button>
</el-tooltip>
</div>
紅色字內容可以不寫默認是黑色的，這樣還要改箭頭的顏色。
uj5u.com熱心網友回復：
<div class="item123"><el-tooltip effect="dark" content="Top Left 提示文字" placement="top-start">
<button>11111 </button>
</el-tooltip>
</div>
uj5u.com熱心網友回復：
/deep/改變是可以成功的 我覺得你看看你的tooltip結構，看看你給的class給你綁哪里去了，是不是層級錯了uj5u.com熱心網友回復：
你看看這個彈窗系結可不是在盒子下面uj5u.com熱心網友回復：
這些組件的東西 不要覺得 它系結的東西就在盒子的下面，自己看看清楚位置再寫樣式啥的uj5u.com熱心網友回復：
用深度選擇器，比如vue中可以使用 ::v-deep [要修改的類名]，其他框架看深度選擇器，當然還有注意Scss和less語法可能也不一致，總得來說先看你使用什么來撰寫css，然后去百度對應的深度選擇器uj5u.com熱心網友回復：
最常用也是最好的方法：在assets檔案夾里面寫一個style.less/.css檔案
這個檔案是修改 組件里面的 樣式
然后在main.js里面引入；注意要在引入組件樣式之后引入；
權重的話，每個.vue檔案最外層可以加一個id='idName'；用id來加權重和區別不同組件，防止沖突影響
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/10654.html
標籤：HTML(CSS)