el-input 改变背景色

给 输入区域改变背景色

<tr align="center"  v-for="it in summaryUnderData" :key="it.id" style="background-color: #f3f3f3 ">
          <td>{{it.post}}</td>
          <td>{{it.total}}</td>
          <td>{{it.monthly}}</td>
          <td>
            <el-form :model="summaryPostData" >
              <el-form-item prop="remark">
                <el-input  type="textarea" :rows="3" v-model="it.remark" placeholder="请输入备注" maxlength="150" show-word-limit
                           style="font-size: 16px;" >
                </el-input>
              </el-form-item>
            </el-form>
            <el-button type="primary" @click="submitFormSecond(it)"style="float: right;"  
                       icon="el-icon-circle-check">保存</el-button>
          </td>

        </tr>

现在代码达到的效果是数据行的背景色已经成#f3f3f3，但是备注输入框内的背景色 没有跟随着改变

尝试过直接用内联样式 ：

style="font-size: 16px;background-color: #f3f3f3"但是没有效果，相反改变的是输入框的边框

查阅资料又一种写法：

::v-deep .el-input__inner{
  background-color: #f3f3f3;
}

改变的是页面中其他输入框的输入区域颜色    table表格中的并无效果，接着去查其他的资料 得到的结果也不是我想要的，但我收到了启发，f12页面进入元素模式追踪一下我需要修改的元素块。

如图：

 然后我就在style中 用textarea.el-textarea__inner{background :#f3f3f3}没想到成功改变了 接着0/150这部分背景色没有改变 如法炮制；也用同样的方法就可以改变

最后考虑了会不会影响其他页面的问题，那就加一个唯一的标识名

 <el-input  type="textarea" :rows="3" v-model="it.remark" placeholder="请输入备注" maxlength="150" show-word-limit
                           style="font-size: 16px;" class="f3">
                </el-input>


<style>
.f3 .el-textarea__inner{
  background: #f3f3f3;
}
 .f3 .el-input__count{
  background: #f3f3f3 !important;
}
</style>