欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

设置element 分页的背景色和选中颜色

程序员文章站 2022-04-05 15:26:52
...

element 分页

<div class="paging">
          <el-pagination
            small
            :current-page.sync="start"
            :pager-count="5"
            layout="prev, pager, next"
            :total="total"
            @current-change="changeCurrent"
          >
          </el-pagination>
        </div>

css

  .paging {
        margin-top: 10px ;
        height: 45px;
        /*width: 312px;*/
        ::v-deep {
          .el-pagination {
            height: 45px;
            text-align: center;
            /*width: 100px;*/
          }
          .el-pagination .el-pager li:not(.disabled) {
            background-color: rgba(
              38,
              67,
              123,
              0.1
            ); // 进行修改未选中背景和字体
            color: #fff;
          }
          .el-pagination .el-pager li:not(.disabled).active {
            background-color: rgba(
              38,
              67,
              123,
              0.1
            ); // 进行修改选中项背景和字体
            color: #04bdf5;
          }
          .el-pagination .btn-prev,
          .btn-next {
            background-color: rgba(99, 135, 206, 0); // 进行修改选中项背景和字体
            color: #04bdf5;
          }
        }
      }
相关标签: vue.js