我想禁用文本区域的可调整大小属性。
目前,我可以通过单击文本区域的右下角并拖动鼠标来调整文本区域的大小。如何禁用此功能?
我想禁用文本区域的可调整大小属性。
目前,我可以通过单击文本区域的右下角并拖动鼠标来调整文本区域的大小。如何禁用此功能?
当前回答
要禁用所有文本区域的大小调整,请执行以下操作:
textarea {
resize: none;
}
要禁用特定文本区域的大小调整,请添加属性、名称或id并将其设置为某个值。在本例中,它被命名为noresize
HTML
<textarea name='noresize' id='noresize'> </textarea>
CSS
/* Using the attribute name */
textarea[name=noresize] {
resize: none;
}
/* Or using the id */
#noresize {
resize: none;
}
其他回答
您只需使用:resize:none;在CSS中。
resize属性指定元素是否可调整大小由用户执行。注意:resize属性适用于计算溢出的元素价值不是“可见”。
目前Internet Explorer不支持调整大小。
以下是用于调整大小的不同财产:
不调整大小:
textarea {
resize: none;
}
双向调整大小(垂直和水平):
textarea {
resize: both;
}
垂直调整大小:
textarea {
resize: vertical;
}
水平调整大小:
textarea {
resize: horizontal;
}
此外,如果您的CSS或HTML中有宽度和高度,它将阻止您的文本区域被调整大小,并提供更广泛的浏览器支持。
我发现了两件事:
第一
textarea{resize: none}
这是一个尚未发布的CSS 3,与Firefox 4(及更高版本)、Chrome和Safari兼容。
另一个格式特性是溢出:考虑到dir属性,自动删除右滚动条。
代码和不同的浏览器
基本HTML
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<textarea style="overflow:auto;resize:none" rows="13" cols="20"></textarea>
</body>
</html>
某些浏览器
Internet Explorer 8
Firefox 17.0.1
铬
这可以在HTML中轻松完成:
<textarea name="textinput" draggable="false"></textarea>
这对我有用。可拖动属性的默认值为true。
CSS3为UI元素提供了一个新属性,允许您执行此操作。该属性是resize属性。因此,您可以将以下内容添加到样式表中,以禁用所有文本区域元素的大小调整:
textarea { resize: none; }
这是一个CSS 3属性;使用兼容性图表查看浏览器兼容性。
就个人而言,我会发现在文本区域元素上禁用大小调整非常烦人。这是设计者试图“破坏”用户客户端的情况之一。如果您的设计不能容纳更大的文本区域,您可能需要重新考虑您的设计是如何工作的。任何用户都可以将textarea{resize:both!important;}添加到他们的用户样式表中,以覆盖您的偏好。
您需要在component.CSS中设置以下CSS代码
textarea {
resize: none;
}