elementui（el-date-picker）日期选择器的日历样式修改

最新推荐文章于 2024-07-31 14:01:28 发布

长箭已搭弓

最新推荐文章于 2024-07-31 14:01:28 发布

阅读量1.4k

点赞数 1

分类专栏： vue 文章标签：前端

本文链接：https://blog.csdn.net/include_computer/article/details/119946173

版权

vue 专栏收录该内容

14 篇文章 0 订阅

订阅专栏


/*日历样式----------------------------------------------------------*/
  .selfDate {
    background-color: #08294c !important;
    color: #61b7ff;
    border: 1px solid #85e9fc;

    .el-picker-panel__sidebar {
      background-color: #08294c !important;
      border: 1px solid #85e9fc;

      .el-picker-panel__shortcut {
        color: #61b7ff;
      }
    }

    .el-date-picker__header-label {
      color: #61b7ff;
    }

    .el-date-picker__header--bordered {
      border-bottom: solid 1px #85e9fc;
    }

    .el-picker-panel__content {
      .el-year-table td .cell, .el-month-table td .cell {
        color: #61b7ff;
      }
    }

    .el-picker-panel__icon-btn {
      color: #61b7ff;
    }

    .el-date-range-picker__content .el-date-range-picker__header div {
      color: #7aa8fe;
    }

    .el-date-table td.next-month,
    .el-date-table td.prev-month {
      color: #255687;
    }

    .el-date-table td.in-range div {
      background-color: #183870;
    }

    .el-date-range-picker__content.is-left {
      border: 1px solid #244588;

    }

    .el-date-table th {
      color: #7aa8fe;
    }

    .el-date-table th {
      border-bottom: 1px solid #244588;
    }

    .el-date-table td.start-date div,
    .el-date-table td.end-date div {
      color: #fff;

    }

    .el-date-table td.start-date span,
    .el-date-table td.end-date span {
      background: #083671;
    }
  }
  /*日历样式------------------------------------------------------------------------*/