我想禁用文本区域的可调整大小属性。
目前,我可以通过单击文本区域的右下角并拖动鼠标来调整文本区域的大小。如何禁用此功能?
我想禁用文本区域的可调整大小属性。
目前,我可以通过单击文本区域的右下角并拖动鼠标来调整文本区域的大小。如何禁用此功能?
当前回答
如果你需要深度支持,你可以使用一种老式的技巧:
textarea {
max-width: /* desired fixed width */ px;
min-width: /* desired fixed width */ px;
min-height: /* desired fixed height */ px;
max-height: /* desired fixed height */ px;
}
其他回答
textarea {
resize: none;
}
上面的代码将禁用项目中所有<textarea/>元素的可调整大小属性。如果您希望这样做很好,否则您将希望为textarea元素使用特定的类。
.not-resizable {
resize: none;
}
在HTML中
<textarea class="not-resizable"></textarea>
<textarea style="resize:none" rows="10" placeholder="Enter Text" ></textarea>
CSS 3可以解决这个问题。不幸的是,现在只有60%的浏览器支持它。
对于Internet Explorer和iOS,您不能关闭调整大小,但可以通过设置文本区域的宽度和高度来限制文本区域的大小。
/* One can also turn on/off specific axis. Defaults to both on. */
textarea { resize:vertical; } /* none|horizontal|vertical|both */
参见演示
您也可以尝试使用jQuery
$('textarea').css("resize", "none");
使用@style,您可以为其设置自定义大小并禁用调整大小功能(resize:none;)。
@Html.TextAreaFor(model => model.YourProperty, new { @style = "width: 90%; height: 180px; resize: none;" })