/deep/ .el-input__inner { border: none !important; border-bottom: 1px solid rgba(0, 0, 0, 0.4) !important; border-radius: 0px !important; }报错

这是一段使用了 /deep/ 伪类的 CSS 代码，用于修改 Element UI 的 el-input 组件的样式。/deep/ 伪类可以用来穿透组件的样式隔离，从而修改组件内部的样式。但是在 Vue 2.x 中，/deep/ 已经被废弃，官方推荐使用 >>> 或者 ::v-deep 伪类来代替。在使用这些伪类的时候，需要注意以下几点：

1. 只有在父组件使用了 scoped 属性才需要使用伪类。
2. >>> 和 ::v-deep 可以互相替换使用。
3. 在某些情况下，伪类可能无法正常工作，比如在使用一些 CSS 预处理器时。

至于你遇到的报错，可能是因为你使用了 /deep/ 伪类，但是它已经被废弃了，所以浏览器会提示错误。你可以尝试使用 >>> 或者 ::v-deep 伪类来代替。

相关问题

.login { display: flex; justify-content: center; align-items: center; height: 100%; background-color: rgba(184, 153, 90, 0.62); } .login-box { width: 1000px; height: 474.38px; border-radius: 8px; display: flex; } .login-box img { width: 60%; height: auto; } .title { margin: 0px auto 30px auto; text-align: center; color: #707070; } .login-form { background: #fdfdfd; width: 40%; border-radius: 0px 8px 8px 0px; display: flex; justify-content: center; align-items: center; } .login-form .el-form { width: 214px; height: 307px; } .login-form .el-form-item { margin-bottom: 30px; } .login-form .el-form-item.is-error .el-input__inner { border: 0 !important; border-bottom: 1px solid #fd7065 !important; background: #fff !important; } .login-form .input-icon { height: 32px; width: 18px; margin-left: -2px; } .login-form .el-input__inner { border: 0; border-bottom: 1px solid #e9e9e8; border-radius: 0; font-size: 14px; font-weight: 400; color: #333333; height: 32px; line-height: 32px; } .login-form .el-input__prefix { left: 0; } .login-form .el-input--prefix .el-input__inner { padding-left: 26px; } .login-form .el-input__inner::placeholder { color: #aeb5c4; } .login-form .el-form-item--medium .el-form-item__content { line-height: 32px; } .login-form .el-input--medium .el-input__icon { line-height: 32px; } .login-btn { border-radius: 17px; padding: 11px 20px !important; margin-top: 10px; font-weight: 500; font-size: 14px; border: 0; background-color: #ffc200; } .login-btn:hover, .login-btn:focus { /* background: #FFC200; */ /* color: #ffffff; */ } .login-form-title { height: 36px; display: flex; justify-content: center; align-items: center; margin-bottom: 40px; } .login-form-title .title-label { font-weight: 500; font-size: 20px; color: #333333; margin-left: 10px; }

这是一段 CSS 样式代码，用于设置登录页面的样式。其中包括登录框的大小、颜色、输入框的样式、按钮的样式等。它使用了 flex 布局来使页面元素居中对齐，并使用了 border-radius 属性来设置圆角。此外，它还定义了:hover 和:focus 状态下按钮的样式，使用户能够在鼠标悬停或聚焦时获得反馈。

他的内部有el-dialog .updateDialog1 { position: relative; margin: 0 auto 50px; border-radius: 5px; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); box-sizing: border-box; width: 50%; .el-dialog__header { padding: 20px 20px 0px; 这些设置都无效 依然设置的是msgCardDialog下的el-dialoog

根据你提供的代码，`.updateDialog1` 这个选择器并没有包含 `.el-dialog` 这个子选择器，所以它并不能直接作用于内部的 `el-dialog` 组件。

如果你想要设置 `.updateDialog1` 选择器中的样式作用于内部的 `el-dialog` 组件，你可以添加 `/deep/` 或 `::v-deep` 穿透选择器来覆盖内部组件的样式，如下所示：

<style scoped>
.updateDialog1 {
  /deep/ .el-dialog__header {
    padding: 20px 20px 0px;
  }
}
</style>

在上面的例子中，我们使用 `/deep/` 穿透选择器来选择内部 `el-dialog` 组件的 `.el-dialog__header` 元素，并将其上部内边距设置为 20px，覆盖了父级组件的样式。

需要注意的是，`/deep/` 穿透选择器已经被废弃，推荐使用 `::v-deep` 穿透选择器来代替。另外，如果你使用了 `scoped` 属性，则 `::v-deep` 穿透选择器必须写在选择器的开头。