HTML - max 属性

HTML 的max属性用于定义输入字段可接受和有效的最大值。

输入的值必须小于或等于 max 值。如果表单输入字段值大于 max 属性值，则在提交表单时会显示一些警告。

语法

<input max="number|date">

应用于

以下列出的元素允许使用 HTML max 属性

元素	描述
<input>	HTML <input> 标签用于接受用户输入的各种类型。
<progress>	HTML <progress> 标签用于显示任务完成进度的指示器
<meter>	HTML <meter> 标签用于在给定范围内呈现数据。

HTML max 属性示例

以下示例将说明 HTML low 属性，以及我们应该在哪里以及如何使用此属性！

设置数字输入的最大值

在以下示例中，我们使用 max 属性和 input type=number 来指定数字输入的最大值为 5。

<!DOCTYPE html>
<html lang="en">

<head>
   <title>HTML max attribute</title>
</head>

<body>
   <form> 
      Enter Number: 
      <input type="number" max="5">
      <button>Submit</button>
   </form>
</body>

</html>

设置日期输入的最大值

考虑另一种情况，我们将使用 max 属性和 input type=date 来设置日期输入的最大允许值。

<!DOCTYPE html>
<html lang="en">

<head>
   <title>HTML max attribute</title>
</head>

<body>
   <form> Enter the date before 2021-02-02: 
   <br>
   <input type="date" max="2021-02-02">
      <button>Submit</button>
   </form>
</body>
</html>

设置进度条的最大值

在以下示例中，我们定义一个进度条并将其最大值设置为 100，以便以百分比显示当前进度。

<!DOCTYPE html>
<html>
<body>

<h1>The progress Bar</h1>

<label for="file">
   Loading progress:
</label>
<progress id="file" 
          value="32" 
          max="100"> 
</progress>

</body>
</html>

设置仪表元素的最大值

在以下示例中，我们将创建一个仪表元素并将最大值设置为 100 以显示百分比进度。

<!DOCTYPE html>
<html lang="en">
<body>
      <h3>HTML low Attribute</h3>
      <label for="server-load">
         Room 1: Server Load
      </label> 
      <meter id="server-load" 
             value="40" 
             min="0" 
             max="100" 
             low="50" 
             high="90" 
             optimum="0.5">
      </meter>
</body>

</html>

支持的浏览器

属性
max	是 5.0	是 10.0	是 16.0	是 5.1	是 10.6

html_attributes_reference.htm

打印页面

上一个

下一个