自定义element单选框样式

最新推荐文章于 2024-06-19 15:29:29 发布

33455432

最新推荐文章于 2024-06-19 15:29:29 发布

阅读量289

点赞数 7

文章标签： javascript chrome 开发语言

本文链接：https://blog.csdn.net/weixin_38999134/article/details/137038342

版权

在这里插入图片描述

  .noalarmbg{
        background: rgb(6, 233, 17);
        color: #fff;
        padding: 10px;
        border-radius: 5px;
      }
      .alarmbg{
        background: rgb(197, 90, 17);
        color: #000;
        padding: 10px;
        border-radius: 5px;
      }
      .el-radio--medium.is-bordered .el-radio__label{
        font-size: 18px !important;
      }
      默认样式
      .alarmbg .el-radio--medium.is-bordered{
        background: rgb(197, 90, 17);
        color: #fff;
        height: 70px !important;
      }
      .noalarmbg .el-radio--medium.is-bordered{
        background: rgb(12, 29, 105);
        color: #fff;
        height: 70px !important;
      }
      // icon 默认样式
      .alarmbg  .el-radio__inner {
        background: rgb(197, 90, 17);
        border: 1px solid rgba(23, 150, 165);
      }
      // icon 默认样式
      .noalarmbg  .el-radio__inner {
        background: rgb(12, 29, 105);
        border: 1px solid rgba(23, 150, 165);
      }

      // 选中文本样式
      .el-radio__input.is-checked + .el-radio__label {
        color: #fff;
      }
      // 选中 icon 样式
      .el-radio__inner::after {
        background-color: #04fb5b;
      }
      .leftbox .el-card__body{
        height: 700px;
      }
      .el-radio__input.is-checked .el-radio__inner{
        border-color: #04fb5b;
        background: #04fb5b;
      }
      .el-radio.is-bordered.is-checked {
        border: 5px solid #04fb5b;
        height: 73px !important;
      }