Skip to content

Commit f604f83

Browse files
jaywcjlovejaywcjlove
committed
doc: add low/max/maxlength attribute document.
1 parent 7542c57 commit f604f83

File tree

5 files changed

+157
-9
lines changed

5 files changed

+157
-9
lines changed

‎docs/attribute/list.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ HTML list 属性
3535

3636
| 属性 Attribute | ![chrome][1] | ![edge][2] | ![firefox][3] | ![safari][4] | ![opera][5] |
3737
| ------- | --- | --- | --- | --- | --- |
38-
| list | 20.0 | 10.0 | 4.0 | Not supported | 9.6 |
38+
| list | 20.0 | 10.0 | 4.0 | ❌ 不支持 | 9.6 |
3939

4040
[1]: ../assets/chrome.svg
4141
[2]: ../assets/edge.svg

‎docs/attribute/loop.md‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
HTML loop 属性
22
===
33

4+
[![](https://shields.io/badge/HTML5-<audio>兼容-green?logo=HTML5)](https://caniuse.com/mdn-html_elements_audio_loop)
5+
[![](https://shields.io/badge/HTML5-<video>兼容-green?logo=HTML5)](https://caniuse.com/mdn-html_elements_video_loop)
6+
47
## 定义和用法
58

69
`loop` 属性是一个布尔属性。
@@ -52,8 +55,8 @@ HTML loop 属性
5255

5356
| 属性 Attribute | ![chrome][1] | ![edge][2] | ![firefox][3] | ![safari][4] | ![opera][5] |
5457
| ------- | --- | --- | --- | --- | --- |
55-
| [\<audio>](../tags/audio.md) | 4.0 | 9.0 | 3.5 | 4.0 | 10.5 |
56-
| [\<video>](../tags/video.md) | 4.0 | 9.0 | 11.0 | 4.0 | 10.5 |
58+
| [\<audio>](../tags/audio.md) loop | 4.0 | 9.0 | 3.5 | 4.0 | 10.5 |
59+
| [\<video>](../tags/video.md) loop | 4.0 | 9.0 | 11.0 | 4.0 | 10.5 |
5760

5861
[1]: ../assets/chrome.svg
5962
[2]: ../assets/edge.svg

‎docs/attribute/low.md‎

Lines changed: 36 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,38 @@
1-
low.md
1+
HTML low 属性
22
===
33

4-
欢迎您编辑 <a target="__blank" href="https://github.com/jaywcjlove/html-tutorial/blob/main/docs/attribute/low.md">docs/attribute/low.md</a> 文件，共建 HTML Tutorial 文档。
4+
## 定义和用法
5+
6+
`low` 属性指定仪表的值被认为是低值的范围。
7+
8+
`low` 属性值必须大于 [`min`](./min.md) 属性值，也必须小于 [`high`](./high.md) 和 [`max`](./max.md) 属性值。
9+
10+
## 适用于
11+
12+
`low` 属性可用于以下元素：
13+
14+
| 元素 Element | 属性 Attribute |
15+
| ----- | ----- |
16+
| [\<meter>](../tags/meter.md) | [low](../tags/meter_low.md) |
17+
18+
## 示例
19+
20+
具有当前值和最小、最大、高和低段的仪表：
21+
22+
```html idoc:preview:iframe
23+
<meter min="0" low="40" high="90" max="100" value="95"></meter>
24+
```
25+
26+
## 浏览器支持
27+
28+
表中的数字指定了完全支持该属性的第一个浏览器版本。
29+
30+
| 属性 Attribute | ![chrome][1] | ![edge][2] | ![firefox][3] | ![safari][4] | ![opera][5] |
31+
| ------- | --- | --- | --- | --- | --- |
32+
| low | 8.0 | ❌ 不支持 | 6.0 | 6.0 | 11.0 |
33+
34+
[1]: ../assets/chrome.svg
35+
[2]: ../assets/edge.svg
36+
[3]: ../assets/firefox.svg
37+
[4]: ../assets/safari.svg
38+
[5]: ../assets/opera.svg

‎docs/attribute/max.md‎

Lines changed: 64 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,66 @@
1-
max.md
1+
HTML max 属性
22
===
33

4-
欢迎您编辑 <a target="__blank" href="https://github.com/jaywcjlove/html-tutorial/blob/main/docs/attribute/max.md">docs/attribute/max.md</a> 文件，共建 HTML Tutorial 文档。
4+
## 定义和用法
5+
6+
`max` 属性指定元素的最大值。
7+
8+
当被 `<progress>` 元素使用时，`max` 属性指定任务总共需要多少工作。
9+
10+
## Applies to
11+
12+
`max` 属性可用于以下元素：
13+
14+
| 元素 Element | 属性 Attribute |
15+
| ----- | ----- |
16+
| [\<input>](../tags/input.md) | [max](../tags/input_max.md) |
17+
| [\<meter>](../tags/meter.md) | [max](../tags/meter_max.md) |
18+
| [\<progress>](../tags/progress.md) | [max](../tags/progress_max.md) |
19+
20+
## 示例
21+
22+
使用 [min](./min.md) 和 max 属性：
23+
24+
```html idoc:preview:iframe
25+
<form action="/action_page.php">
26+
Enter a date before 1980-01-01:
27+
<input type="date" name="bday" max="1979-12-31"><br/>
28+
Enter a date after 2000-01-01:
29+
<input type="date" name="bday" min="2000-01-02"><br/>
30+
Quantity (between 1 and 5):
31+
<input type="number" name="quantity" min="1" max="5"><br/>
32+
<input type="submit">
33+
</form>
34+
```
35+
36+
### Meter 示例
37+
38+
具有当前值和最小[min](./min.md)、最大、高和低段的仪表：
39+
40+
```html idoc:preview:iframe
41+
<meter min="0" low="40" high="90" max="100" value="95"></meter>
42+
```
43+
44+
### Progress 示例
45+
46+
正在下载：
47+
48+
```html idoc:preview:iframe
49+
<progress value="22" max="100"></progress>
50+
```
51+
52+
## 浏览器支持
53+
54+
`max` 属性对每个元素都有以下浏览器支持：
55+
56+
| 元素 Element | ![chrome][1] | ![edge][2] | ![firefox][3] | ![safari][4] | ![opera][5] |
57+
| ------- | --- | --- | --- | --- | --- |
58+
| [\<input>](../tags/input.md) | 5.0 | 10.0 | 16.0 | 5.1 | 10.6 |
59+
| [\<meter>](../tags/meter.md) | 8.0 | ❌ 不支持 | 6.0 | 6.0 | 11.0 |
60+
| [\<progress>](../tags/progress.md) | 8.0 | 10.0 | 16.0 | 6.0 | 11.0 |
61+
62+
[1]: ../assets/chrome.svg
63+
[2]: ../assets/edge.svg
64+
[3]: ../assets/firefox.svg
65+
[4]: ../assets/safari.svg
66+
[5]: ../assets/opera.svg

‎docs/attribute/maxlength.md‎

Lines changed: 51 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,53 @@
1-
maxlength.md
1+
HTML maxlength 属性
22
===
33

4-
欢迎您编辑 <a target="__blank" href="https://github.com/jaywcjlove/html-tutorial/blob/main/docs/attribute/maxlength.md">docs/attribute/maxlength.md</a> 文件，共建 HTML Tutorial 文档。
4+
## 定义和用法
5+
6+
`maxlength` 属性指定元素中允许的最大字符数。
7+
8+
## 适用于
9+
10+
`maxlength` 属性可用于以下元素：
11+
12+
| 元素 Element | 属性 Attribute |
13+
| ----- | ----- |
14+
| [\<input>](../tags/input.md) | [maxlength](../tags/input_maxlength.md) |
15+
| [\<textarea>](../tags/textarea.md) | [maxlength](../tags/textarea_maxlength.md) |
16+
17+
## 示例
18+
19+
### Input 示例
20+
21+
最大长度为 10 个字符的 [\<input>](../tags/input.md) 元素：
22+
23+
```html idoc:preview:iframe
24+
<form action="/action_page.php">
25+
Username: <input type="text" name="usrname" maxlength="10"><br>
26+
<input type="submit" value="Submit">
27+
</form>
28+
```
29+
30+
### Textarea 示例
31+
32+
最大长度为 50 个字符的文本区域：
33+
34+
```html idoc:preview:iframe
35+
<textarea maxlength="50">
36+
在这里输入文本...
37+
</textarea>
38+
```
39+
40+
## 浏览器支持
41+
42+
`maxlength` 属性对每个元素都有以下浏览器支持：
43+
44+
| 元素 Element | ![chrome][1] | ![edge][2] | ![firefox][3] | ![safari][4] | ![opera][5] |
45+
| ------- | --- | --- | --- | --- | --- |
46+
| input | 1.0 | 2.0 | 1.0 | 1.0 | 1.0 |
47+
| textarea | Yes | 10.0 | 4.0 | Yes | 15.0 |
48+
49+
[1]: ../assets/chrome.svg
50+
[2]: ../assets/edge.svg
51+
[3]: ../assets/firefox.svg
52+
[4]: ../assets/safari.svg
53+
[5]: ../assets/opera.svg

0 commit comments

Comments
 (0)