doc: add autocomplete,autofocus attribute document.

Author: jaywcjlove

docs/attribute/alt.md

@@ -59,7 +59,7 @@ HTML alt 属性
 
 `alt` 属性对每个元素都有以下浏览器支持：
 
-| Element | ![chrome][1] | ![edge][2] | ![firefox][3] | ![safari][4] | ![opera][5] |
+| 标签 Element | ![chrome][1] | ![edge][2] | ![firefox][3] | ![safari][4] | ![opera][5] |
 | ------- | --- | --- | --- | --- | --- |
 | area    | Yes | Yes | Yes | Yes | Yes |
 | img     | Yes | Yes | Yes | Yes | Yes |

docs/attribute/async.md

@@ -1,4 +1,47 @@
-async.md
+HTML async 属性
 ===
 
-欢迎您编辑 <a target="__blank" href="https://github.com/jaywcjlove/html-tutorial/blob/main/docs/attribute/async.md">docs/attribute/async.md</a> 文件，共建 HTML Tutorial 文档。
+## 定义和用法
+
+`async` 属性是一个布尔属性。
+
+如果存在，它指定脚本将在可用时立即异步执行。
+
+**注意：** `async` 属性仅适用于外部脚本（并且仅应在存在 `src` 属性时使用）。
+
+**注意：** 有几种方法可以执行外部脚本：
+
+* 如果 `async` 存在：脚本与页面的其余部分异步执行（脚本将在页面继续解析时执行）
+* 如果 `async` 不存在且 [`defer`](../tags/script_defer.md) 存在：脚本在页面完成解析后执行
+* 如果 `async` 或 [`defer`](../tags/script_defer.md) 都不存在：在浏览器继续解析页面之前立即获取并执行脚本
+
+## 适用于
+
+`async` 属性可用于以下元素：
+
+| 标签 Element | 属性 Attribute |
+| ----- | ----- |
+| [\<script>](../tags/script.md) | [async](../tags/script_async.md) |
+
+## Script 示例
+
+一个将在可用时立即异步运行的脚本：
+
+```html
+<script src="demo_async.js" async></script>
+```
+
+## 浏览器支持
+
+表中的数字指定了完全支持该属性的第一个浏览器版本。
+
+| Element | ![chrome][1] | ![edge][2] | ![firefox][3] | ![safari][4] | ![opera][5] |
+| ------- | --- | --- | --- | --- | --- |
+| async     | Yes | 10.0 | 3.6 | Yes | Yes |
+
+
+[1]: ../assets/chrome.svg
+[2]: ../assets/edge.svg
+[3]: ../assets/firefox.svg
+[4]: ../assets/safari.svg
+[5]: ../assets/opera.svg

docs/attribute/autocomplete.md

@@ -1,4 +1,63 @@
-autocomplete.md
+HTML autocomplete 属性
 ===
 
-欢迎您编辑 <a target="__blank" href="https://github.com/jaywcjlove/html-tutorial/blob/main/docs/attribute/autocomplete.md">docs/attribute/autocomplete.md</a> 文件，共建 HTML Tutorial 文档。
+## 定义和用法
+
+`autocomplete` 属性指定表单或输入字段是否应该打开或关闭自动完成功能。
+
+自动完成允许浏览器预测值。 当用户开始输入字段时，浏览器应根据之前输入的值显示填充字段的选项。
+
+**提示：** 可以为表单设置“开启”自动完成功能，为特定输入字段设置“关闭”功能，反之亦然。
+
+**注意：** `autocomplete` 属性适用于以下 [`<input>`](../tags/input.md) 类型：[文本](../tags/input_type_text.md)、[搜索](../tags/input_type_search.md)、[url](../tags/input_type_url.md)、[电话](../tags/input_type_tel.md)、[电子邮件](../tags/input_type_email.md)、[密码](../tags/input_type_password.md)、[日期选择器](../tags/input_type_date.md)、[范围](../tags/input_type_range.md)和[颜色](../tags/input_type_color.md)。
+
+## 适用于
+
+`autocomplete` 属性可用于以下元素：
+
+| 标签 Element | 属性 Attribute |
+| ----- | ----- |
+| [\<form>](../tags/form.md)   | [autocomplete](../tags/form_autocomplete.md)  |
+| [\<input>](../tags/input.md) | [autocomplete](../tags/input_autocomplete.md) |
+
+## 示例
+
+### Form 示例
+
+具有自动完成功能的表单：
+
+```html idoc:preview:iframe
+<form action="/action\_page.php" method="get" autocomplete="on">
+  First name:<input type="text" name="fname"><br>
+  E-mail: <input type="email" name="email"><br>
+  <input type="submit">
+</form>
+```
+
+### Input 示例
+
+具有自动完成功能的 HTML 表单（一个输入字段关闭）：
+
+```html idoc:preview:iframe
+<form action="/action_page.php" autocomplete="on">
+  First name:<input type="text" name="fname"><br>
+  Last name: <input type="text" name="lname"><br>
+  E-mail: <input type="email" name="email" autocomplete="off"><br>
+  <input type="submit">
+</form>
+```
+
+## 浏览器支持
+
+`autocomplete` 属性对每个元素都有以下浏览器支持：
+
+| 标签 Element | ![chrome][1] | ![edge][2] | ![firefox][3] | ![safari][4] | ![opera][5] |
+| ------- | --- | --- | --- | --- | --- |
+| [form](../tags/form.md)    | Yes  | Yes | 4.0 | 5.2 | 15.0 |
+| [input](../tags/input.md)   | 17.0 | 5.0 | 4.0 | 5.2 | 9.6  |
+
+[1]: ../assets/chrome.svg
+[2]: ../assets/edge.svg
+[3]: ../assets/firefox.svg
+[4]: ../assets/safari.svg
+[5]: ../assets/opera.svg

docs/attribute/autofocus.md

@@ -1,4 +1,68 @@
-autofocus.md
+HTML autofocus 属性
 ===
 
-欢迎您编辑 <a target="__blank" href="https://github.com/jaywcjlove/html-tutorial/blob/main/docs/attribute/autofocus.md">docs/attribute/autofocus.md</a> 文件，共建 HTML Tutorial 文档。
+## 定义和用法
+
+`autofocus` 属性是一个布尔属性。
+
+当存在时，它指定元素在页面加载时应该自动获得焦点。
+
+## 适用于
+
+`autofocus` 属性可用于以下元素：
+
+| 标签 Element | 属性 Attribute |
+| ----- | ----- |
+| [\<button>](../tags/button.md)     | [autofocus](../tags/button_autofocus.md)   |
+| [\<input>](../tags/input.md)       | [autofocus](../tags/input_autofocus.md)    |
+| [\<select>](../tags/select.md)     | [autofocus](../tags/select_autofocus.md)   |
+| [\<textarea>](../tags/textarea.md) | [autofocus](../tags/textarea_autofocus.md) |
+
+## 示例
+
+### Button 示例
+
+带自动对焦的按钮：
+
+```html idoc:preview:iframe
+<button type="button" autofocus>Click Me!</button>
+```
+
+### Input 示例
+
+让 “名” 输入字段在页面加载时自动获得焦点：
+
+```html idoc:preview:iframe
+<form action="/action_page.php">
+  名: <input type="text" name="fname" autofocus><br>
+  姓: <input type="text" name="lname"><br>
+  <input type="submit">
+</form>
+```
+
+### Textarea 示例
+
+具有自动对焦的文本区域：
+
+```html idoc:preview:iframe
+<textarea autofocus>
+我们提供所有 Web 开发技术的免费教程。
+</textarea>
+```
+
+## 浏览器支持
+
+`autofocus` 属性对每个元素都有以下浏览器支持：
+
+| 标签 Element | ![chrome][1] | ![edge][2] | ![firefox][3] | ![safari][4] | ![opera][5] |
+| ------- | --- | --- | --- | --- | --- |
+| form     | 5.0 | 10.0 | 4.0 | 5.0 | 9.6 |
+| input    | 5.0 | 10.0 | 4.0 | 5.0 | 9.6 |
+| textarea | Yes | 10.0 | 4.0 | Yes | Yes |
+
+
+[1]: ../assets/chrome.svg
+[2]: ../assets/edge.svg
+[3]: ../assets/firefox.svg
+[4]: ../assets/safari.svg
+[5]: ../assets/opera.svg

docs/tags/blockquote.md

@@ -73,4 +73,11 @@ blockquote {
   margin-left: 40px;
   margin-right: 40px;
 }
-```
+```
+
+
+[1]: ../assets/chrome.svg
+[2]: ../assets/edge.svg
+[3]: ../assets/firefox.svg
+[4]: ../assets/safari.svg
+[5]: ../assets/opera.svg

docs/tags/embed.md

@@ -75,4 +75,11 @@ HTML \<embed> 标签
 embed:focus {
   outline: none;
 }
-```
+```
+
+
+[1]: ../assets/chrome.svg
+[2]: ../assets/edge.svg
+[3]: ../assets/firefox.svg
+[4]: ../assets/safari.svg
+[5]: ../assets/opera.svg

docs/tags/head.md

@@ -105,4 +105,11 @@ HTML tutorial: [HTML Head](../tutorial/head.md)
 head {
   display: none;
 }
-```
+```
+
+
+[1]: ../assets/chrome.svg
+[2]: ../assets/edge.svg
+[3]: ../assets/firefox.svg
+[4]: ../assets/safari.svg
+[5]: ../assets/opera.svg