在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ element-ui 卡片頭部樣式在scoped下失效

element-ui 卡片頭部樣式在scoped下失效

我想改變卡片頭部的樣式，發(fā)現(xiàn)影響到其他頁面的卡片，
于是加了scoped，
可是修改的樣式就失效了，請問改怎么配置

 div(slot="header")
    span 產(chǎn)品名稱: APEX-XXX  
.el-card__header {
    background-color: #999999;
    padding: 10px 20px;
  }
回答
編輯回答
柚稚

https://vue-loader.vuejs.org/...
去看深度選擇器

2017年1月27日 20:04
編輯回答
枕頭人

scoped之后，該組件樣式就私有化了，實際上的樣式會變成類似于這樣的：

.el-card__header[data-v-51a1741d] {
    padding: 18px 20px;
    border-bottom: 1px solid #ebeef5;
    box-sizing: border-box;
}

所以你不管怎么改.el-card__header都是沒用的，可以試試曲線救國：

<el-card class="box-card">
  <div slot="header" class="clearfix">
    <div style="margin:-18px -20px; padding:10px 20px; background: #999999;">自定義header樣式</div>
  </div>
  <div v-for="o in 4" :key="o" class="text item">
    {{'列表內(nèi)容 ' + o }}
  </div>
</el-card>
2017年5月22日 15:39
編輯回答
避風(fēng)港

加important

2018年8月24日 01:15
編輯回答
心癌

去掉scoped 然后在該vue文件最外側(cè)套個盒子，再更改樣式

2017年12月28日 00:19