贵阳市建设城乡规划局网站,一个新产品策划方案,系统软件开发定制,南京 网站开发什么待遇啊背景 在 Element UI 中#xff0c;当您使用 el-input 组件并设置 typetextarea 时#xff0c;默认情况下#xff0c;用户可以通过拖动输入框的右下角来调整其大小。如果您想禁止这种缩放行为#xff0c;需要使用 CSS 来覆盖默认的浏览器行为。 注意上图#x…背景 在 Element UI 中当您使用 el-input 组件并设置 typetextarea 时默认情况下用户可以通过拖动输入框的右下角来调整其大小。如果您想禁止这种缩放行为需要使用 CSS 来覆盖默认的浏览器行为。 注意上图第一张是可以缩放的第二章不能缩放的。区别就在于右下角的展示
实现 1、在 Element UI 中当您使用 el-input 组件并设置 typetextarea 时默认情况下用户可以通过拖动输入框的右下角来调整其大小。如果您想禁止这种缩放行为您需要使用 CSS 来覆盖默认的浏览器行为。
el-input typetextarea :rows2 :cols30 placeholder请输入内容 styleresize: none;
/el-input
2、全局样式在您的 CSS 文件中添加样式规则
.el-textarea__inner { resize: none;
}
确保这个 CSS 规则在 Element UI 的样式之后加载以确保它可以正确地覆盖默认样式。
3、Scoped CSS如果您在单文件组件中使用 Vue并希望仅在该组件中应用此样式可以使用 scoped CSS。
style scoped
.el-textarea__inner { resize: none;
}
/style
同样确保这个样式规则在 Element UI 的样式之后加载。
