在el-dialog中改变el-input背景颜色 以及el-form的el-input样式控制

el-dialog部分

问题：在el-dialog中，/deep/ el-input__inner 失效了。

方案：利用浏览器工具查看具体原因，确定是哪一个控件的问题，如图：

1.浏览器中按F12，利用动态选中，查看是哪个容器相关

2.发现原来是【Form】表单的问题

3.在vue中的css设置【一般是<style>下，增加/deep/ 以及浏览器中提取的控件块】

以此类推，遇到不会改的elementUI控件，用浏览器动态选中的模块能看到对应CSS样式信息，复制到你的代码中，即style标签里加上 /deep/ 即可。

<style scoped>

/deep/ form input:not(.submit) {
  background: rgba(16, 205, 117, 0.06);
}

</style>

el-form的in-put样式部分

关键部分:  cell-style = "cekkStyleRef"

<template>   
<div>
 <div class="table-container">
      <template style="width: 550px;margin-top: -25px">
        <el-table  :data="tableDataReg" :cell-style="cellStyleReg"
                   :header-cell-style="{fontSize: '12px', backgroundColor: '#f8f8f8',color:'#333'}"
                   style="width: 550px;margin-top: -25px">
          <el-table-column prop="col1" label="Project Info." width="100"></el-table-column>
          <el-table-column prop="col2" label="" width="150" ></el-table-column>
          <el-table-column prop="col3" label=""  width="150"></el-table-column>
          <el-table-column prop="col4" label="" width="150"></el-table-column>
        </el-table>
      </template>
    </div>
</div>
</template>

}

method：

export default {
    cellStyleReg({row,column,rowIndex,columnIndex}){
      if ((column.property === "col2" || column.property === "col4")) {
        return {
          "background": "white",
          "color": "rgb(202, 1, 35)"
        };
      }
    }
}