AutoCorrect files/zh-cn/learn/{f,g,h,i}*

files/zh-cn/learn/forms/basic_native_form_controls/index.md

@@ -228,7 +228,7 @@ HTML5 中添加了其它的文本输入类型，如：{{HTMLElement("input/searc
 
 ![Default, focused and disabled button input types in Firefox 71 and Safari 13 on Mac and Chrome 79 and Edge 18 on Windows 10](buttons.png)
 
-从技术上讲，使用{{HTMLElement("button")}}元素或{{HTMLElement("input")}}元素定义的按钮几乎没有区别。唯一值得注意的区别是按钮本身的标签。在{{HTMLElement("input")}}元素中，标签只能是字符数据，而在{{HTMLElement("button")}}元素中，标签可以是HTML，因此可以相应地进行样式化。
+从技术上讲，使用{{HTMLElement("button")}}元素或{{HTMLElement("input")}}元素定义的按钮几乎没有区别。唯一值得注意的区别是按钮本身的标签。在{{HTMLElement("input")}}元素中，标签只能是字符数据，而在{{HTMLElement("button")}}元素中，标签可以是 HTML，因此可以相应地进行样式化。
 
 ### 图像按钮
 

files/zh-cn/learn/forms/how_to_build_custom_form_controls/example_2/index.html

@@ -9,7 +9,7 @@
 ---
 <p>这是解释 <a href="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets" title="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets">如何构建自定义表单小部件</a>的第二个示例。</p>
 
-<h2 id="JS" name="JS">使用JS</h2>
+<h2 id="JS" name="JS">使用 JS</h2>
 
 <h3 id="HTML_内容">HTML 内容</h3>
 
@@ -169,11 +169,11 @@ <h3 id="JavaScript_内容">JavaScript 内容</h3>
   form.classList.add("widget");
 });</pre>
 
-<h3 id="使用JS的结果">使用JS的结果</h3>
+<h3 id="使用JS的结果">使用 JS 的结果</h3>
 
 <p>{{ EmbedLiveSample('JS', 120, 130) }}</p>
 
-<h2 id="No_JS" name="No_JS">不使用JS</h2>
+<h2 id="No_JS" name="No_JS">不使用 JS</h2>
 
 <h3 id="HTML_内容_2">HTML 内容</h3>
 
@@ -208,6 +208,6 @@ <h3 id="CSS_内容_2">CSS 内容</h3>
   overflow : hidden;
 }</pre>
 
-<h3 id="不使用JS的结果">不使用JS的结果</h3>
+<h3 id="不使用JS的结果">不使用 JS 的结果</h3>
 
 <p>{{ EmbedLiveSample('No_JS', 120, 130) }}</p>

files/zh-cn/learn/forms/index.md

@@ -1,5 +1,5 @@
 ---
-title: HTML表单指南
+title: HTML 表单指南
 slug: Learn/Forms
 tags:
   - Beginner
@@ -53,7 +53,7 @@ translation_of: Learn/Forms
 ## 表单样式指南
 
 - [HTML 表单样式](/zh-CN/docs/Learn/Forms/Styling_web_forms)
-  - : 本文介绍了使用CSS的样式表单，包括您可能需要了解的基本样式任务的所有基础知识。
+  - : 本文介绍了使用 CSS 的样式表单，包括您可能需要了解的基本样式任务的所有基础知识。
 - [高级表单样式](/zh-CN/docs/Learn/Forms/Advanced_form_styling)
   - : 在这里，我们将看到一些更高级的表单样式技术，这些技术需要在处理一些更难以设置样式的元素时使用。
 - [UI 伪类](/zh-CN/docs/Learn/Forms/UI_pseudo-classes)

files/zh-cn/learn/forms/property_compatibility_table_for_form_controls/index.html

@@ -60,7 +60,7 @@ <h3 id="Global_behaviors">Global behaviors</h3>
  <dt>{{cssxref("line-height")}}</dt>
  <dd>不同浏览器支持不同，避免使用</dd>
  <dt>{{cssxref("text-decoration")}}</dt>
- <dd>Opera表单不支持</dd>
+ <dd>Opera 表单不支持</dd>
  <dt>{{cssxref("text-overflow")}}</dt>
  <dd>Opera, Safari,  IE9 表单不支持</dd>
  <dt>{{cssxref("text-shadow")}}</dt>
@@ -206,7 +206,7 @@ <h3 id="Text_fields">Text fields</h3>
    <td>
     <ol>
      <li>WebKit 浏览器 (主要在 Mac OSX and iOS 上) 的搜索域使用原生的样式和行为。因此，需要使用 <code>-webkit-appearance:none</code> 才能将这个属性应用到搜索域上。</li>
-     <li>在 Windows 7上, Internet Explorer 9 不会应用到边框上，除非 <code>background:none</code> 已应用。</li>
+     <li>在 Windows 7 上，Internet Explorer 9 不会应用到边框上，除非 <code>background:none</code> 已应用。</li>
     </ol>
    </td>
   </tr>
@@ -217,7 +217,7 @@ <h3 id="Text_fields">Text fields</h3>
    <td>
     <ol>
      <li>WebKit 浏览器 (主要在 Mac OSX and iOS 上) 的搜索域使用原生的样式和行为。因此，需要使用 <code>-webkit-appearance:none</code> 才能将这个属性应用到搜索域上。</li>
-     <li>在 Windows 7上, Internet Explorer 9 不会应用到边框上，除非 <code>background:none</code> 已应用。</li>
+     <li>在 Windows 7 上，Internet Explorer 9 不会应用到边框上，除非 <code>background:none</code> 已应用。</li>
      <li>在 Opera 上，只有当边框明确设定时 {{cssxref("border-radius")}} 属性才会应用</li>
     </ol>
    </td>

files/zh-cn/learn/front-end_web_developer/index.md

@@ -20,7 +20,7 @@ translation_of: Learn/Front-end_web_developer
 
 ## 涵盖的主题
 
-该路线图涵盖的主题大致范围如下:
+该路线图涵盖的主题大致范围如下：
 
 - 基础准备以及如何学习
 - Web 标准和最佳实践 (例如辅助功能和跨浏览器兼容)
@@ -49,13 +49,13 @@ translation_of: Learn/Front-end_web_developer
 
 ### 起步
 
-学习用时: 1–2 小时
+学习用时：1–2 小时
 
 #### 预备知识
 
 仅需基础的计算机知识。
 
-#### 我怎么知道自己是否可以继续往下学习了?
+#### 我怎么知道自己是否可以继续往下学习了？
 
 本章节没有评估测试，但是请不要跳过它 — 这对于帮你准备好应对后面的练习和学习非常重要。
 
@@ -67,13 +67,13 @@ translation_of: Learn/Front-end_web_developer
 
 ### HTML 语义和结构
 
-学习用时: 35–50 小时
+学习用时：35–50 小时
 
 #### 预备知识
 
 基础的计算机知识和基本的 Web 开发环境。
 
-#### 我怎么知道自己是否可以继续往下学习了?
+#### 我怎么知道自己是否可以继续往下学习了？
 
 每个模块的评估练习都是针对测试你主题相关知识掌握能力设计的，完成了每个练习就表示你可以继续往后学习下一个模块了。
 
@@ -85,13 +85,13 @@ translation_of: Learn/Front-end_web_developer
 
 ### 使用 CSS 布局和美化
 
-学习用时: 90–120 小时
+学习用时：90–120 小时
 
 #### 预备知识
 
 学习 CSS 前需要有基础的 HTML 知识，请至少学习完 [HTML 介绍](/zh-CN/docs/Learn/HTML/Introduction_to_HTML)再开始。
 
-#### 我怎么知道自己是否可以继续往下学习了?
+#### 我怎么知道自己是否可以继续往下学习了？
 
 每个模块的评估练习都是针对测试你主题相关知识掌握能力设计的，完成了每个练习就表示你可以继续往后学习下一个模块了。
 
@@ -108,13 +108,13 @@ translation_of: Learn/Front-end_web_developer
 
 ### 使用 JavaScript 开发交互
 
-学习用时: 135–185 小时
+学习用时：135–185 小时
 
 #### 预备知识
 
 学习 JavaScript 前需要有基础的 HTML 知识，请至少学习完 [HTML 介绍](/zh-CN/docs/Learn/HTML/Introduction_to_HTML)再开始。
 
-#### 我怎么知道自己是否可以继续往下学习了?
+#### 我怎么知道自己是否可以继续往下学习了？
 
 每个模块的评估练习都是针对测试你主题相关知识掌握能力设计的，完成了每个练习就表示你可以继续往后学习下一个模块了。
 
@@ -128,13 +128,13 @@ translation_of: Learn/Front-end_web_developer
 
 ### Web 表单 — 处理用户数据
 
-学习用时: 40–50 小时
+学习用时：40–50 小时
 
 #### 预备知识
 
 高效使用 Web 表单需要 HTML、CSS 和 JavaScript 知识。鉴于与表格打交道的复杂性，这一节被独立了出来。
 
-#### 我怎么知道自己是否可以继续往下学习了?
+#### 我怎么知道自己是否可以继续往下学习了？
 
 每个模块的评估练习都是针对测试你主题相关知识掌握能力设计的，完成了每个练习就表示你可以继续往后学习下一个模块了。
 
@@ -144,13 +144,13 @@ translation_of: Learn/Front-end_web_developer
 
 ### 让所有人都能使用 Web
 
-学习用时: 45-55 小时
+学习用时：45-55 小时
 
 #### 预备知识
 
 学习本章前最好对 HTML、CSS 和 JavaScript 都有一定了解— 本章很多技术和最佳实践都需要用到它们。
 
-#### 我怎么知道自己是否可以继续往下学习了?
+#### 我怎么知道自己是否可以继续往下学习了？
 
 每个模块的评估练习都是针对测试你主题相关知识掌握能力设计的，完成了每个练习就表示你可以继续往后学习下一个模块了。
 
@@ -161,13 +161,13 @@ translation_of: Learn/Front-end_web_developer
 
 ### 现代工具
 
-学习用时: 55–90 小时
+学习用时：55–90 小时
 
 #### 预备知识
 
 学习本章前最好对 HTML、CSS 和 JavaScript 都有一定了解— 本章很多技术和最佳实践都需要用到它们。
 
-#### 我怎么知道自己是否可以继续往下学习了?
+#### 我怎么知道自己是否可以继续往下学习了？
 
 本章节各模块均没有评估测试，但是第 2 章和第 3 章的学习教程应该能够让你很好的掌握现代工具的要义。
 

files/zh-cn/learn/getting_started_with_the_web/css_basics/index.html

@@ -41,7 +41,7 @@ <h2 id="CSS_究竟什么来头？">CSS 究竟什么来头？</h2>
 
 <h3 id="“CSS_规则集”详解">“CSS 规则集”详解</h3>
 
-<p>让我们来仔细看一看上述CSS：</p>
+<p>让我们来仔细看一看上述 CSS：</p>
 
 <p><img alt="图解CSS声明" src="https://mdn.mozillademos.org/files/16483/css-declaration.png"></p>
 
@@ -97,7 +97,7 @@ <h3 id="不同类型的选择器">不同类型的选择器</h3>
  <tbody>
   <tr>
    <td>元素选择器（也称作标签或类型选择器）</td>
-   <td>所有指定(该)类型的 HTML 元素</td>
+   <td>所有指定 (该) 类型的 HTML 元素</td>
    <td><code>p</code><br>
     选择 <code>&lt;p&gt;</code></td>
   </tr>
@@ -148,7 +148,7 @@ <h2 id="字体和文本">字体和文本</h2>
   <p>将下列代码添加到相应的位置，用你在 Google Fonts 找到的字体替代 <code>font-family</code> 中的占位行。（ <code>font-family</code> 意味着你想要你的文本使用的字体。）这条规则首先为整个页面设定了一个全局字体和字号（因为 <code>&lt;html&gt;</code> 是整个页面的父元素，而且它所有的子元素都会继承相同的 <code>font-size</code> 和 <code>font-family</code>）：</p>
 
   <pre class="brush: css notranslate">html {
-  /* px 表示 “像素（pixels）”: 基础字号为 10 像素 */
+  /* px 表示“像素（pixels）”: 基础字号为 10 像素 */
   font-size: 10px;
   /* Google fonts 输出的 CSS */
   font-family: 'Open Sans', sans-serif;
@@ -233,7 +233,7 @@ <h3 id="文档体格式设置">文档体格式设置</h3>
  <li><code>width: 600px;</code> —— 强制页面永远保持 600 像素宽。</li>
  <li><code>margin: 0 auto;</code> —— 为 <code>margin</code> 或 <code>padding</code> 等属性设置两个值时，第一个值代表元素的上方<strong>和</strong>下方（在这个例子中设置为 <code>0</code>），而第二个值代表左边<strong>和</strong>右边（在这里，<code>auto</code><strong> </strong>是一个特殊的值，意思是水平方向上左右对称）。你也可以使用一个，三个或四个值，参考 <a href="/zh-CN/docs/Web/CSS/margin#取值">这里</a> 。</li>
  <li><code>background-color: #FF9500;</code> —— 如前文所述，指定元素的背景颜色。我们给 body 用了一种略微偏红的橘色以与深蓝色的 {{htmlelement("html")}} <strong> </strong>元素形成反差，你也可以尝试其它颜色。</li>
- <li><code>padding: 0 20px 20px 20px;</code> —— 我们给内边距设置了四个值来让内容四周产生一点空间。这一次我们不设置上方的内边距，设置右边，下方，左边的内边距为20像素。值以上、右、下、左的顺序排列。</li>
+ <li><code>padding: 0 20px 20px 20px;</code> —— 我们给内边距设置了四个值来让内容四周产生一点空间。这一次我们不设置上方的内边距，设置右边，下方，左边的内边距为 20 像素。值以上、右、下、左的顺序排列。</li>
  <li><code>border: 5px solid black;</code> —— 直接为 body 设置 5 像素的黑色实线边框。</li>
 </ul>
 
@@ -288,7 +288,7 @@ <h2 id="小结">小结</h2>
 
 <p>若遇到问题，可以参考 GitHub 上的 <a href="https://github.com/roy-tian/learning-area/tree/master/extras/getting-started-web/beginner-html-site-styled">完整示例代码</a> 做对比。</p>
 
-<p>本章介绍的 CSS 知识非常有限，更多内容请访问 <a href="/zh-CN/Learn/CSS">CSS学习页面</a>。</p>
+<p>本章介绍的 CSS 知识非常有限，更多内容请访问 <a href="/zh-CN/Learn/CSS">CSS 学习页面</a>。</p>
 
 <p>{{PreviousMenuNext("Learn/Getting_started_with_the_web/HTML_basics", "Learn/Getting_started_with_the_web/JavaScript_basics", "Learn/Getting_started_with_the_web")}}</p>
 

files/zh-cn/learn/getting_started_with_the_web/dealing_with_files/index.md

@@ -24,7 +24,7 @@ translation_of: Learn/Getting_started_with_the_web/Dealing_with_files
 
 ## 关于大小写和空格的提示
 
-你会注意到，在这篇文章中，我们要求你完全用小写字母命名文件夹和文件，没有空格. 这是因为：
+你会注意到，在这篇文章中，我们要求你完全用小写字母命名文件夹和文件，没有空格。这是因为：
 
 1. 许多计算机，特别是网络服务器，是区分大小写的。因此，假如你把一张图片放在你的网站上 `test-site/MyImage.jpg`，然后在一个不同的文件中，你试图以 `test-site/myimage.jpg` 来调用该图片，它可能无法工作。
 2. 浏览器、网络服务器和编程语言对空格的处理并不一致。例如，如果你在文件名中使用空格，一些系统可能将其视为两个文件名。一些服务器会用“%20”（URL 中空格的字符代码）替换文件名中的区域，导致所有链接被破坏。最好用连字符而不是下划线来分隔单词。对比 `my-file.html` 与 `my_file.html`。
@@ -35,10 +35,10 @@ translation_of: Learn/Getting_started_with_the_web/Dealing_with_files
 
 接下来，让我们看看我们的测试网站应该是什么结构。在我们创建的任何网站项目中，最常见的是一个主页 HTML 文件和包含图像、样式文件和脚本文件的文件夹。现在让我们来创建这些：
 
-1. **`index.html`**： 这个文件一般会包含主页内容，也就是人们第一次进入网站时看到的文字和图片。使用文本编辑器，创建一个名为`index.html`的新文件，并将其保存在`test-site`文件夹内。
-2. **`images` 文件夹**： 这个文件夹包含网站上使用的所有图片。在 `test-site` 文件夹内创建一个名为 `images` 的文件夹。
-3. **`styles` 文件夹**： 这个文件夹包含用于设置内容样式的 CSS 代码（例如，设置文本和背景颜色）。在你的 `test-site` 文件夹内创建一个名为 `styles` 的文件夹。
-4. **`scripts` 文件夹**： 这个文件夹包含所有用于向网站添加交互功能的 JavaScript 代码（例如，点击时加载数据的按钮）。在 `test-site` 文件夹内创建一个名为 `scripts` 的文件夹。
+1. **`index.html`**：这个文件一般会包含主页内容，也就是人们第一次进入网站时看到的文字和图片。使用文本编辑器，创建一个名为`index.html`的新文件，并将其保存在`test-site`文件夹内。
+2. **`images` 文件夹**：这个文件夹包含网站上使用的所有图片。在 `test-site` 文件夹内创建一个名为 `images` 的文件夹。
+3. **`styles` 文件夹**：这个文件夹包含用于设置内容样式的 CSS 代码（例如，设置文本和背景颜色）。在你的 `test-site` 文件夹内创建一个名为 `styles` 的文件夹。
+4. **`scripts` 文件夹**：这个文件夹包含所有用于向网站添加交互功能的 JavaScript 代码（例如，点击时加载数据的按钮）。在 `test-site` 文件夹内创建一个名为 `scripts` 的文件夹。
 
 > **备注：** 在 Windows 上你可能看不到文件扩展名，因为 Windows 有一个默认开启的**隐藏已知文件类型的扩展名**的选项。一般来说，你可以通过 Windows 资源管理器，选择**文件夹选项**选项，取消勾选**隐藏已知文件类型的扩展名**复选框，然后点击**确认**将其关闭。对于涉及你的 Windows 版本的更多具体信息，你可以在网上搜索。
 
@@ -62,7 +62,7 @@ translation_of: Learn/Getting_started_with_the_web/Dealing_with_files
     </html>
     ```
 
-3. 该行代码 `<img src="" alt="My test image">` 用于向页面中插入图片。我们需要告知 HTML 图片的位置。这张图片位于 *images* 目录下，与 `index.html` 处于同一目录。 为了从 `index.html` 访问到我们的图像，我们需要的文件路径是 `images/your-image-filename`。 例如，这里的图像叫做 `firefox-icon.png`， 那么文件路径就是 `images/firefox-icon.png`。
+3. 该行代码 `<img src="" alt="My test image">` 用于向页面中插入图片。我们需要告知 HTML 图片的位置。这张图片位于 *images* 目录下，与 `index.html` 处于同一目录。为了从 `index.html` 访问到我们的图像，我们需要的文件路径是 `images/your-image-filename`。例如，这里的图像叫做 `firefox-icon.png`，那么文件路径就是 `images/firefox-icon.png`。
 4. 在 HTML 代码 `src=""` 的双引号之间插入文件路径。
 5. 保存 HTML 文件，然后使用浏览器打开（双击该文件）。你应该看到新网页显示了新的图像！
 
@@ -72,7 +72,7 @@ translation_of: Learn/Getting_started_with_the_web/Dealing_with_files
 
 - 若引用的目标文件与 HTML 文件同级，只需直接使用文件名，例如：`my-image.jpg`。
 - 要引用子目录中的文件，请在路径前面写上目录名，再加上一个正斜杠。例如：`subdirectory/my-image.jpg`。
-- 若引用的目标文件位于 HTML 文件的**上级**，需要加上两个点。 举个例子，如果 `index.html` 在 `test-site` 的一个子文件夹内，而 `my-image.jpg` 在 `test-site` 内，你可以使用`../my-image.jpg` 从 `index.html` 引用 `my-image.jpg`。
+- 若引用的目标文件位于 HTML 文件的**上级**，需要加上两个点。举个例子，如果 `index.html` 在 `test-site` 的一个子文件夹内，而 `my-image.jpg` 在 `test-site` 内，你可以使用`../my-image.jpg` 从 `index.html` 引用 `my-image.jpg`。
 - 以上方法可以随意组合，比如：`../subdirectory/another-subdirectory/my-image.jpg`。
 
 这是你目前需要知道的全部内容。