如何更改分页的背景颜色

时间:2019-08-26 08:34:45

标签: javascript vue.js element

我在暗页中使用了分页,我想将其背景颜色更改为透明。

当我不使用“背景”道具时,分页的背景颜色为白色。

它看起来像这样: https://i.loli.net/2019/08/26/YnjtfmglONRBiCM.png(对不起,我无法添加图片)

enter image description here

我的代码:

<el-pagination
        v-if="isPaging"
        @size-change="handleSizeChange"
        @current-change="handlePageChange"
        :current-page="currentPage"
        :page-sizes="pageSizes"
        :page-size="pageSize"
        :total="totalSize"
        layout="total, sizes, prev, pager, next, jumper"
        class="col-12 d-flex justify-content-end flex-wrap">
</el-pagination>

如何将背景颜色更改为透明

2 个答案:

答案 0 :(得分:0)

您应该能够简单地使用CSS来执行此操作,例如通过使用以下内容:

.el-pagination .number,
.el-pagination button:disabled,
.el-pagination .btn-next {
  background:transparent;
}

如果在组件中使用作用域的CSS,则可能必须使用v-deep将其中的CSS应用于子组件:https://vue-loader.vuejs.org/guide/scoped-css.html#deep-selectors

答案 1 :(得分:0)

如果您的意思是覆盖原始颜色,则可以尝试在css文件中添加以下行:

.el-pager li {
    background: transparent !important;
}

或在您的style标签内。