IT 累计浏览 2 CSS field-sizing属性简介 CSS field-sizing 属性是一项新的表单元素样式特性,专用于 `` 和 `` 等输入控件。该特性旨在解决传统表单控件尺寸固定的问题:在过去,若要使输入框的宽度随输入内容自动伸缩,必须借助 JavaScript 动态计算和调整。现在,通过简单的 CSS 声明即可实现这一效果。其核心在于 `field-sizing` 属性,它有两个值:`content`(默认值为 `fixed`,即尺寸固定)。设置 `field-sizing: content` 后,输入框的宽度会根据实际输入文本的长度自动增长或收缩。 需要注意的是,当应用 `content` 值时,HTML 中原本控制尺寸的 `size` 属性(对 ``)以及 `rows` 和 `cols` 属性(对 ``)将失效。此属性同样可用于 `` 元素。在实际布局中,建议结合 `min-width` 和 `max-width` 使用,以避免输入内容过多时破坏页面布局。目前,该特性已获得 Safari 和 Chrome(123+)等主流浏览器的支持。