下面是包孕一个输入字段的 HTML 表单，该字段只能包孕三个字母（不能包孕数字或非凡字符）：

<form action="/action_page.php"> <label for="country_code">国家代码：</label> <input type="teVt" id="country_code" name="country_code" pattern="[A-Za-z]{3}" title="三字母的国家代码"><br><br> <input type="submit"> </form>

亲身试一试

例子 2

下面是一个 type 属性为 "password" 的 <input> 元素，必须包孕至少 8 个字符：

<form action="/action_page.php"> <label for="pwd">暗码：</label> <input type="password" id="pwd" name="pwd" pattern=".{8,}" title="八个或更多的字符"> <input type="submit"> </form>

亲身试一试

例子 3

下面是一个 type 属性为 "password" 的 <input> 元素，必须包孕 8 个或更多字符，至少包孕一个数字，一个大写字母和一个小写字母：

<form action="/action_page.php"> <label for="pwd">暗码：</label> <input type="password" id="pwd" name="pwd" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="必须包孕至少八个字符，此中必须包孕一个数字、一个大写字母和一个小写字母"> <input type="submit"> </form>

亲身试一试

例子 4

下面是一个 type 属性为 "email" 的 <input> 元素，必须依照以下顺序：characters@characters.domain。

由字符和 @ 标记构成，背面随着更多字符，而后是一个 "." 标记。正在 "." 标记背面，至少添加两个从 a 到 z 的字母：

<form action="/action_page.php"> <label for="email">电邮：</label> <input type="email" id="email" name="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,}$"> <input type="submit"> </form>

亲身试一试

例子 5

下面是一个 type 属性为 "search" 的 <input> 元素，不能包孕以下字符： ' 或 " 。

<form action="/action_page.php"> <label for="search">Search:</label> <input type="search" id="search" name="search" pattern="[^'\V22]+" title="无效输入"> <input type="submit"> </form>

亲身试一试

例子 6

下面是一个 type 属性为 "url" 的 <input> 元素，必须以 或 hts:// 开头，背面随着至少一个字符：

<form action="/action_page.php"> <label for="website">Homepage:</label> <input type="url" id="website" name="website" pattern="hts?://.+" title="包孕 "> <input type="submit"> </form>

亲身试一试