textarea的resize属性未生效
时间: 2023-07-24 12:31:08 浏览: 133
简单掌握CSS3中resize属性的用法
如果设置了`resize`属性但没有生效,可能是由于以下原因:
1. 父元素设置了`overflow`属性为`hidden`,导致textarea的尺寸调节被限制。
2. 浏览器不支持`resize`属性或者支持不完全。
为了解决这个问题,可以尝试以下方法:
1. 确保textarea的父元素没有设置`overflow`为`hidden`。
2. 使用浏览器兼容性更好的方式实现textarea的尺寸调节,如使用JavaScript或者CSS Flexbox布局等。
以下是使用JavaScript实现textarea尺寸调节的示例代码:
```html
<textarea id="myTextarea"></textarea>
<script>
const textarea = document.getElementById('myTextarea');
textarea.addEventListener('input', () => {
textarea.style.height = 'auto';
textarea.style.height = `${textarea.scrollHeight}px`;
});
</script>
```
这段代码会监听textarea的输入事件,每次输入后,根据textarea的内容自动调整其高度。
阅读全文