element ui里的 textarea 高度在没有设置autosize 的时候可以用属性 rows='x'来设置
如果设置了autosize 后,rows属性就失效了,本来想着用autosize="{ minRows: 1, maxRows: 4}",来设置高度应该是可以的,但是textarea 默认 rows='2',所以方法行不通
然后想着用textarea 的高度来限制,发现限制高度了autosize设置的就不起作用了。这个文本框的height是由行内样式所控制面对这个问题,
最后发现textarea的高度可以用padding来撑开,然后就在浏览器调整需要撑开的高度,这样光标也会居中的
.el-textarea__inner{ // padding: 14px 115px 14px 15px !important; line-height: 21px; padding: 10px 110px 10px 8px !important; // 只要改变这里的 padding 就可以影响到 textarea 的高度 }
因为我右侧要预留出比较大的宽度来放按钮,我就测试了,发现了110px的大小比较适合我的宽度
设计还要求placeholder内容要居中然后就将placeholder设置line-height达到想要的高度就可以了。
::placeholder{ font-size: 12px; line-height: 20px; }
至此所有的功能就实现了。
标签:autosize,textarea,高度,height,padding,设置 From: https://www.cnblogs.com/NicoleYe/p/17389283.html