autocapitalize
autocapitalize
全局属性 是 enumerated 属性,用于控制输入的文本是否自动大写,如果是,则以何种方式自动大写。这与:
¥The autocapitalize
global attribute is an enumerated attribute that controls whether inputted text is automatically capitalized and, if so, in what manner. This is relevant to:
<input>
和<textarea>
元素。- 任何设置了
contenteditable
的元素。
autocapitalize
不会影响在物理键盘上键入时的行为。它会影响其他输入机制的行为,例如移动设备上的虚拟键盘和语音输入。这可以帮助用户更快、更轻松地输入数据,例如自动大写每个句子的第一个字母。
¥autocapitalize
doesn't affect behavior when typing on a physical keyboard. It affects the behavior of other input mechanisms such as virtual keyboards on mobile devices and voice input. This can assist users by making data entry quicker and easier, for example by automatically capitalizing the first letter of each sentence.
值
¥Value
可能的值为:
¥Possible values are:
none
或off
-
不要自动将任何文本大写。
sentences
或on
-
自动将每个句子的第一个字符大写。
words
-
自动将每个单词的第一个字符大写。
characters
-
自动将每个字符大写。
使用说明
¥Usage notes
- 可以在
<input>
和<textarea>
元素以及它们包含的<form>
元素上设置autocapitalize
。当在<form>
元素上设置autocapitalize
时,它会为所有包含的<input>
和<textarea>
设置自动大写行为,从而覆盖在包含的元素上设置的任何autocapitalize
值。 autocapitalize
对url
、email
或password
<input>
类型没有影响,这些类型从不启用自动大写。- 如果未指定
autocapitalize
,则采用的默认行为因浏览器而异。例如:- Chrome 和 Safari 默认为
on
/sentences
- Firefox 默认为
off
/none
。
- Chrome 和 Safari 默认为
示例
HTML
<p>Form to test different autocapitalize settings:</p>
<form>
<div>
<label for="default">Default: no autocapitalize set</label>
<input type="text" id="default" name="default" />
</div>
<div>
<label for="off">autocapitalize="off"</label>
<input type="text" id="off" name="off" autocapitalize="off" />
</div>
<div>
<label for="none">autocapitalize="none"</label>
<input type="text" id="none" name="none" autocapitalize="none" />
</div>
<div>
<label for="on">autocapitalize="on"</label>
<input type="text" id="on" name="on" autocapitalize="on" />
</div>
<div>
<label for="sentences">autocapitalize="sentences"</label>
<input
type="text"
id="sentences"
name="sentences"
autocapitalize="sentences" />
</div>
<div>
<label for="words">autocapitalize="words"</label>
<input type="text" id="words" name="words" autocapitalize="words" />
</div>
<div>
<label for="characters">autocapitalize="characters"</label>
<input
type="text"
id="characters"
name="characters"
autocapitalize="characters" />
</div>
<div>
<label for="characters-ta">autocapitalize="characters" on textarea</label>
<textarea
type="text"
id="characters-ta"
name="characters-ta"
autocapitalize="characters">
</textarea>
</div>
</form>
<hr />
<p contenteditable autocapitalize="characters">
This content is editable and has autocapitalize="characters" set on it
</p>
div {
margin-bottom: 20px;
}
结果
规范
Specification |
---|
HTML Standard # attr-autocapitalize |
浏览器兼容性
BCD tables only load in the browser
¥Browser compatibility