代码：
css:

.el-form-item {
    border: 1px solid rgba(255, 255, 255, 0.1);
    // background: rgba(0, 0, 0, 0.1);
    color: #454545;
    border-radius: 10px;
    border-color: #c7c7c7;
    transition: all .3s;
    margin-bottom: 36px;
  }
  .el-form-item:focus-within {
    border-color: #3677f0;
    background-color: #f1f6fe;
  }

html:

<el-form-item prop="username">
            <el-input
              ref="username"
              v-model="loginForm.username"
              placeholder="请输入账号"
              name="username"
              type="text"
              tabindex="1"
              autocomplete="on"
            />
</el-form-item>

效果图：当点击里面的input框的时候input得到焦点，外层div就会有相当于拥有了input：focus的伪类选择一样，可以适用于更多的需求场景