element plus分页背景颜色
时间: 2023-09-30 22:12:43 浏览: 62
Element Plus 是一款基于 Vue.js 的 UI 组件库,用于构建 Web 应用程序。要设置分页组件的背景颜色,可以通过 CSS 来实现。以下是一个示例代码:
```
<template>
<div class="pagination-container">
<el-pagination
background-color="#f0f0f0"
:current-page="currentPage"
:page-sizes="[10, 20, 30, 40]"
:page-size="pageSize"
layout="sizes, prev, pager, next, jumper"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange">
</el-pagination>
</div>
</template>
<script>
export default {
data() {
return {
currentPage: 1,
pageSize: 10,
total: 100
};
},
methods: {
handleSizeChange(size) {
this.pageSize = size;
},
handleCurrentChange(page) {
this.currentPage = page;
}
}
};
</script>
<style scoped>
.pagination-container {
background-color: #f0f0f0;
}
</style>
```
在上述代码中,我们通过设置 `.pagination-container` 类的 `background-color` 属性来设置分页组件的背景颜色。你可以根据需要修改 `.pagination-container` 类的样式和 `background-color` 的值来改变分页组件的背景颜色。