Vue ElementUI el-select 改变高度

Vue ElementUI el-select 改变高度_第1张图片

默认高度是 40px。

自定义高度要修改内部 css。注意右侧的箭头也要修改,否则会有偏移问题

直接上代码

说明:

  1. 使用 stylus,style 标签 没有设置 scoped,所以是全局设置,但要设置一个自定义class,如: my-el-select。这样不会影响项目中其它的 el-select。
  2. el-input__inner:改变高度,el-input__suffix:改变箭头的 位置。这两个的值可在F12 调试时,测试获取。
  3. el-select 的宽度可自定义 class 设置,或外面套一个div设置。因为编译后它最外层是个div。

Vue ElementUI el-select 改变高度_第2张图片

PS:

el-select 下来列表 z-index 默认为 2001,所以要注意它父级的 z-index ,否则会在下面

Vue ElementUI el-select 改变高度_第3张图片

你可能感兴趣的:(ElementUI,vue,elementui)