mdn · irvin · Jun 4, 2022 · Jun 4, 2022
@@ -10,7 +10,7 @@
 
 <p>未来手游一定是Web的天下，许多开发在游戏开发过程中首先选择手游 — 既然如此，触摸控制是不可少的。我们将在本教程中了解怎样简单地在移动端H5游戏中实现触摸控制 ，只要移动端支持触摸，你就可以尽情的玩。</p>
 
-<p class="note"><strong>说明</strong>：游戏 <a class="external external-icon" href="http://rogers2.enclavegames.com/demo/">Captain Rogers: Battle at Andromeda</a> 是基于<a href="http://phaser.io/">Phaser</a> 和Phaser-based管理控制，但它也可以用纯JavaScript实现。使用Phaser的好处它提供了辅助变量和方法可以直接调用，有助于快速的开发游戏，这需要根据项目实际情况选择。</p>
+<p><strong>说明</strong>：游戏 <a class="external external-icon" href="http://rogers2.enclavegames.com/demo/">Captain Rogers: Battle at Andromeda</a> 是基于<a href="http://phaser.io/">Phaser</a> 和Phaser-based管理控制，但它也可以用纯JavaScript实现。使用Phaser的好处它提供了辅助变量和方法可以直接调用，有助于快速的开发游戏，这需要根据项目实际情况选择。</p>
 
 <h2 id="纯_JavaScript_方式实现">纯 JavaScript 方式实现</h2>
 

@@ -3,7 +3,7 @@
 slug: Glossary/Adobe_Flash
 translation_of: Glossary/Adobe_Flash
 ---
-<p id="Summary">Flash 是一项过时的技术，由 Adobe 开发。Flash 使得富 Web 应用程序、矢量图形和多媒体成为可能。您需要安装正确的插件以在支持的{{Glossary("Browser","网页浏览器")}}使用 Flash。</p>
+<p>Flash 是一项过时的技术，由 Adobe 开发。Flash 使得富 Web 应用程序、矢量图形和多媒体成为可能。您需要安装正确的插件以在支持的{{Glossary("Browser","网页浏览器")}}使用 Flash。</p>
 
 <h2 id="了解更多">了解更多</h2>
 

@@ -3,7 +3,7 @@
 slug: Glossary/Browsing_context
 translation_of: Glossary/Browsing_context
 ---
-<p id="Summary"><strong>浏览上下文</strong>（browsing context）是一个浏览器（browser）展示文档（{{domxref("Document")}}）的环境。在现代浏览器中，通常是一个标签页（tab），也可能是一个窗体（window）或只是页面的一部分，如 frame 或 iframe。</p>
+<p><strong>浏览上下文</strong>（browsing context）是一个浏览器（browser）展示文档（{{domxref("Document")}}）的环境。在现代浏览器中，通常是一个标签页（tab），也可能是一个窗体（window）或只是页面的一部分，如 frame 或 iframe。</p>
 
 <p>每个浏览器上下文都有一个特殊源，一个的活动文档源（origin）和一个记录所有展示文档的历史（history）。</p>
 

@@ -8,7 +8,7 @@
 translation_of: Glossary/DOM
 ---
 <div class="boxed translate-rendered">
-<p class="ordinary-output target-output">DOM（Document Object Model——文档对象模型）是用来呈现以及与任意 HTML 或 XML文档交互的API。DOM 是载入到浏览器中的文档模型，以节点树的形式来表现文档，每个节点代表文档的构成部分（例如:页面元素、字符串或注释等等）。</p>
+<p>DOM（Document Object Model——文档对象模型）是用来呈现以及与任意 HTML 或 XML文档交互的API。DOM 是载入到浏览器中的文档模型，以节点树的形式来表现文档，每个节点代表文档的构成部分（例如:页面元素、字符串或注释等等）。</p>
 
 <p>DOM 是万维网上使用最为广泛的API之一，因为它允许运行在浏览器中的代码访问文件中的节点并与之交互。节点可以被创建，移动或修改。事件监听器可以被添加到节点上并在给定事件发生时触发。</p>
 

@@ -5,9 +5,9 @@
   - DoS攻击
 translation_of: Glossary/DOS_attack
 ---
-<p id="Summary">DoS是一种网络攻击手段，它通过给服务器（ {{glossary("server")}} ）发送大量请求来阻止对资源的合法使用。</p>
+<p>DoS是一种网络攻击手段，它通过给服务器（ {{glossary("server")}} ）发送大量请求来阻止对资源的合法使用。</p>
 
-<p id="In_Depth">计算机资源有限，比如算力和内存。当这些资源过载时，程序可能会发生冻结或崩溃，使程序不可用。Dos攻击结合多种技术来竭尽资源，使合法用户无法使用服务器或网络，或者至少让服务器反应迟缓。</p>
+<p>计算机资源有限，比如算力和内存。当这些资源过载时，程序可能会发生冻结或崩溃，使程序不可用。Dos攻击结合多种技术来竭尽资源，使合法用户无法使用服务器或网络，或者至少让服务器反应迟缓。</p>
 
 <p>还有使用大量服务器来竭尽一台被攻击电脑的资源的攻击方式，分布式拒绝服务（Distributed Denial of Service ，DDoS）攻击。</p>
 

@@ -8,7 +8,7 @@
 translation_of: Glossary/Endianness
 ---
 <div class="center" style="max-width: 42rem;">
-<p id="Summary">字节序，或字节顺序（"Endian"、"endianness" 或 "byte-order"），描述了计算机如何组织字节，组成对应的数字。</p>
+<p>字节序，或字节顺序（"Endian"、"endianness" 或 "byte-order"），描述了计算机如何组织字节，组成对应的数字。</p>
 
 <p>每个内存存储位置都有一个索引或地址。每一 字节可以存储一个8位数字（即 介于<code>0x00</code> 和 <code>0xff</code> 之间），因此，你必须保留不止一个字节来储存一个更大的数字。现在，大部分需占用多个字节的数字排序方式是 <strong>little-endian</strong>（译者注：可称小字节序、低字节序，即低位字节排放在内存的低地址端，高位字节排放在内存的高地址端。与之对应的 big-endian 排列方式相反，可称大字节序、高字节序），所有的英特尔处理器都使用 little-endian。little-endian 的意思是使用低位储存更重要的信息，least-to-most-significant（最不重要的（least significant）字节取第一个位置，或者说地址最低的位置），可类比欧洲通用的日期书写方式（例如，31 December 2050。译者注：年份是最重要的，月份其次，日期最后）。</p>
 

@@ -7,7 +7,7 @@
   - truthy
 translation_of: Glossary/Falsy
 ---
-<p id="Summary"><strong>falsy </strong>值 (虚值) 是在 {{Glossary("Boolean")}} 上下文中认定为 false 的值。</p>
+<p><strong>falsy </strong>值 (虚值) 是在 {{Glossary("Boolean")}} 上下文中认定为 false 的值。</p>
 
 <p>{{Glossary("JavaScript")}} 在需要用到布尔类型值的上下文中使用强制类型转换({{Glossary("Type_Conversion", "Type Conversion")}} )将值转换为布尔值，例如<a href="/zh-CN/docs/learn/JavaScript/Building_blocks/conditionals">条件语句</a>和循环语句。</p>
 

@@ -10,7 +10,7 @@
   - Mozilla
 translation_of: Glossary/Gecko
 ---
-<p id="Summary"><strong>Gecko</strong> 是 Mozilla 项目开发的布局引擎，在许多应用程序/设备中使用，包括{{glossary("Mozilla Firefox","Firefox")}} 和 {{glossary("Firefox OS")}}。</p>
+<p><strong>Gecko</strong> 是 Mozilla 项目开发的布局引擎，在许多应用程序/设备中使用，包括{{glossary("Mozilla Firefox","Firefox")}} 和 {{glossary("Firefox OS")}}。</p>
 
 <p>Web {{glossary("browser","浏览器")}} 需要一个被称为布局引擎的软件来解释 {{glossary("HTML")}}, {{glossary("CSS")}}, {{glossary("JavaScript")}}和嵌入式内容（如：图片），并将所有内容绘制到屏幕上。除此之外，Gecko 确保相关的 {{glossary("API","APIs")}} 在 Gecko 支持的每一个操作系统上都能很好的工作，并且适当的 API 只暴露给相关的支持目标。这意味着 Gecko 包括网络栈、图形栈、布局引擎、Javascript 虚拟机和移植层等。</p>
 

@@ -8,7 +8,7 @@
   - grid
 translation_of: Glossary/Grid
 ---
-<p class="brush: css">通过设置CSS属性 <code>display: grid;</code>  可以定义一个 CSS 网格。接着可以使用 {{cssxref("grid-template-rows")}} 和 {{cssxref("grid-template-columns")}} 属性定义网格的列属性(columns)和行属性(rows)。</p>
+<p>通过设置CSS属性 <code>display: grid;</code>  可以定义一个 CSS 网格。接着可以使用 {{cssxref("grid-template-rows")}} 和 {{cssxref("grid-template-columns")}} 属性定义网格的列属性(columns)和行属性(rows)。</p>
 
 <p>使用这些属性定义的网格被称为 <em>显式网格 (explicit grid)。</em></p>
 

@@ -10,7 +10,7 @@
   - WebMechanics
 translation_of: Glossary/IPv6
 ---
-<p id="Summary"><strong>IPv6</strong> 是当前版本的互联网（{{glossary("Internet")}}）通信协议（{{glossary("protocol")}}）。IPv6 正在慢慢地取代 {{Glossary("IPv4")}}，因为 IPv6 允许使用更多不同的 {{Glossary("IP address","IP 地址")}}。</p>
+<p><strong>IPv6</strong> 是当前版本的互联网（{{glossary("Internet")}}）通信协议（{{glossary("protocol")}}）。IPv6 正在慢慢地取代 {{Glossary("IPv4")}}，因为 IPv6 允许使用更多不同的 {{Glossary("IP address","IP 地址")}}。</p>
 
 <h2 id="了解更多">了解更多</h2>
 

@@ -5,7 +5,7 @@
 ---
 <p> </p>
 
-<p id="Summary"><strong>关键字</strong>是用以描述内容的词汇或短语。网上的关键字在搜索引擎中用于搜索或者作为识别网站内容的词汇。</p>
+<p><strong>关键字</strong>是用以描述内容的词汇或短语。网上的关键字在搜索引擎中用于搜索或者作为识别网站内容的词汇。</p>
 
 <p>在使用搜索引擎的时候，你可以用关键字指定搜寻内容，搜索引擎会返回相关网页 。想获得更精确的结果，尝试用更具体的关键字， 比如用 "Blue Mustang GTO" 而不是简单的一个"Mustang".。网页也在meta标签(在{{htmlelement("head")}}部分) 中使用关键字来描述页面内容，以使搜索引擎可以更好地识别和组织网页。</p>
 

@@ -6,7 +6,7 @@
   - 术语
 translation_of: Glossary/Protocol
 ---
-<p id="Summary"><strong>协议</strong>是定义了数据如何在计算机内和之间进行交换的规则的系统。设备之间通信要求设备接受正在交换的数据的格式。定义格式的一组规则称之为协议。</p>
+<p><strong>协议</strong>是定义了数据如何在计算机内和之间进行交换的规则的系统。设备之间通信要求设备接受正在交换的数据的格式。定义格式的一组规则称之为协议。</p>
 
 <h2 id="了解更多">了解更多</h2>
 

@@ -3,7 +3,7 @@
 slug: Glossary/TLS
 translation_of: Glossary/TLS
 ---
-<p id="Summary">传输层安全性协议 (Transport Layer Security，缩写作TLS)，它的前身是安全套接层(Secure Sockets Layer，缩写作SSL)，是一个被应用程序用来在网络中安全通信的 {{Glossary("protocol")}} （通讯协议），防止电子邮件、网页、消息以及其他协议被篡改或是窃听。</p>
+<p>传输层安全性协议 (Transport Layer Security，缩写作TLS)，它的前身是安全套接层(Secure Sockets Layer，缩写作SSL)，是一个被应用程序用来在网络中安全通信的 {{Glossary("protocol")}} （通讯协议），防止电子邮件、网页、消息以及其他协议被篡改或是窃听。</p>
 
 <p>所有现代浏览器都支持TLS协议, 它们都要求服务器提供一个有效的{{Glossary("Digital certificate", "digital certificate")}}（数字证书） 来确认身份以建立安全连接。如果客户端和服务器都能提供自己的数字证书，则它们可以互相认证。</p>
 

@@ -8,7 +8,7 @@
 translation_of: Glossary/Type_Conversion
 original_slug: Glossary/类型转换
 ---
-<p class="syntaxbox">类型转换（或类型变换；英文：Type conversion, typecasting）是指将数据由一种类型变换为另一种类型。在编译器自动赋值时,会发生<em>隐式转换</em>，但在代码中，也可以用一些写法强制要求进行<em>显式转换</em>。例如：在表达式 <code>5 + 2.0</code> 中，整数 <code>5</code> 被隐式转换为浮点数，但 <code>Number("0x11")</code> 和 "0x11" 则被显式转换为数字 17。</p>
+<p>类型转换（或类型变换；英文：Type conversion, typecasting）是指将数据由一种类型变换为另一种类型。在编译器自动赋值时,会发生<em>隐式转换</em>，但在代码中，也可以用一些写法强制要求进行<em>显式转换</em>。例如：在表达式 <code>5 + 2.0</code> 中，整数 <code>5</code> 被隐式转换为浮点数，但 <code>Number("0x11")</code> 和 "0x11" 则被显式转换为数字 17。</p>
 
 <section id="Quick_links">
 <ol>

@@ -242,7 +242,7 @@ <h3 id="保持别抢眼">保持别抢眼</h3>
  <li>为 HTML5 <code>&lt;video&gt;</code>s提供自定义控件，这些控件仅供键盘用户访问，以及如果 JavaScript 不可用(默认 <code>&lt;video&gt;</code>浏览器控件在大多数浏览器中无法使用键盘访问)，就直接通过链接访问视频。</li>
 </ul>
 
-<p id="Client-side_form_validation">例如，我们编写了一个快速而糟糕的客户端客户端表单验证示例 — 请参<a href="https://github.com/mdn/learning-area/blob/master/accessibility/css/form-validation.html">form-validation.html</a>(<a href="http://mdn.github.io/learning-area/accessibility/css/form-validation.html">see the demo live</a>)。在示例中，你会看到一个简单的表格；当您尝试提交一个或两个字段为空的表单时，提交将失败，并且会出现一个错误消息框，告诉您出了什么问题。</p>
+<p>例如，我们编写了一个快速而糟糕的客户端客户端表单验证示例 — 请参<a href="https://github.com/mdn/learning-area/blob/master/accessibility/css/form-validation.html">form-validation.html</a>(<a href="http://mdn.github.io/learning-area/accessibility/css/form-validation.html">see the demo live</a>)。在示例中，你会看到一个简单的表格；当您尝试提交一个或两个字段为空的表单时，提交将失败，并且会出现一个错误消息框，告诉您出了什么问题。</p>
 
 <p>这种表单验证并不引人注目 - 在 JavaScript 不可用的情况下，您仍然可以很好的使用表单，并且任何合理的表单实现都将激活服务器端验证，因为恶意用户很容易绕过客户端验证(例如，通过在浏览器中关闭 JavaScript)。客户端验证对于报告错误仍然非常有用 ––用户可以立即了解他们所犯的错误，而不必等待到服务器的往返和页面重新加载。这是一个明确的可用性优势。</p>
 

@@ -23,7 +23,7 @@
  </tbody>
 </table>
 
-<p id="Summary">所以你已经发布你的网站了对吗 ? 非常棒！ 但是你确定它能够正常运行吗?</p>
+<p>所以你已经发布你的网站了对吗 ? 非常棒！ 但是你确定它能够正常运行吗?</p>
 
 <p>远程 web 服务器与本地服务器的运行表现通常有很大差别，因此在你的网站上线之时对它进行测试是个不错的主意。你可能会对为数众多的问题表示惊讶：图片无法显示，页面无法加载或者加载缓慢，等等。大多数时候这个问题不严重，只是一个小小的错误或者你的web主机配置问题。 </p>
 

@@ -63,7 +63,7 @@ <h3 id="网页">网页</h3>
 
 <p>网络上所有可用的网页都可以通过一个独一无二的地址访问到。要访问一个页面，只需在你的浏览器地址栏中键入页面的地址。 </p>
 
-<p style="text-align: center;"><img alt="Example of a web page address in the browser address bar" src="https://mdn.mozillademos.org/files/8529/web-page.jpg" style="height: 239px; width: 650px;"></p>
+<p><img alt="Example of a web page address in the browser address bar" src="https://mdn.mozillademos.org/files/8529/web-page.jpg" style="height: 239px; width: 650px;"></p>
 
 <h3 id="网站">网站</h3>
 

@@ -44,7 +44,7 @@ <h2 id="如何在浏览器中打开开发者工具">如何在浏览器中打开
 
 <p><img alt="" src="https://mdn.mozillademos.org/files/9605/inspect-element-option.png" style="display: block; height: 264px; margin: 0px auto; width: 350px;"></p>
 
-<p id="调试审查：DOM_Explorer和CSS编辑器">检查器（Inspector）：DOM 浏览器和CSS编辑器</p>
+<p>检查器（Inspector）：DOM 浏览器和CSS编辑器</p>
 
 <p>开发者工具在打开时默认为检查器页面，如下图所示。这个工具可以让你看到你的网页的HTML运行时的样子，以及哪些CSS规则被应用到了页面上元素。它还允许您立即修改HTML和CSS并在浏览器中实时观察修改的结果。</p>
 

@@ -239,7 +239,7 @@ <h3 id="添加我们的JavaScript">添加我们的JavaScript</h3>
 
 <h2 id="一个固定位置的列表消息盒子_2">一个固定位置的列表消息盒子</h2>
 
-<p id="一个固定位置的列表消息盒子">在我们的第二个例子中，我们将会采用我们的第一个例子——我们的消息盒子——把她加到一个满的网页之中去。但是不仅仅是这样——我们将固定她的位置，以便于他能待在浏览器窗口的同一个位置。当主要内容滚动时，这个消息盒子将会待在屏幕的同一个位置。完成的例子：</p>
+<p>在我们的第二个例子中，我们将会采用我们的第一个例子——我们的消息盒子——把她加到一个满的网页之中去。但是不仅仅是这样——我们将固定她的位置，以便于他能待在浏览器窗口的同一个位置。当主要内容滚动时，这个消息盒子将会待在屏幕的同一个位置。完成的例子：</p>
 
 <p><img alt="" src="https://mdn.mozillademos.org/files/13364/fixed-info-box.png" style="border-style: solid; border-width: 1px; display: block; height: 585px; margin: 0px auto; width: 1118px;"></p>
 
@@ -300,7 +300,7 @@ <h3 id="对主内容样式设计">对主内容样式设计</h3>
 
 <h2 id="一个滑动隐藏的面板_2">一个滑动隐藏的面板</h2>
 
-<p id="一个滑动隐藏的面板">最后一个我们在这里介绍的例子是通过按图标使面板滑动出现或者消失——就像前面提到的，这种场景在移动端的布局很流行，因为移动端的屏幕很小，所以你不希望使用大部分界面来显示一个有用的内容而是用消息面板或者菜单代替。</p>
+<p>最后一个我们在这里介绍的例子是通过按图标使面板滑动出现或者消失——就像前面提到的，这种场景在移动端的布局很流行，因为移动端的屏幕很小，所以你不希望使用大部分界面来显示一个有用的内容而是用消息面板或者菜单代替。</p>
 
 <p>我们完工后的例子长这样：</p>
 

@@ -155,7 +155,7 @@ <h2 id="使用类名">使用类名</h2>
   font-weight: bold;
 }</pre>
 
-<p class="brush: html">这个意思是说，“选中每个 <code>special</code> 类的 <code>li</code> 元素”。 你真要这样，好了，它对 <code>&lt;span&gt;</code> 还有其它元素不起作用了。你可以把这个元素再添上去就是了：</p>
+<p>这个意思是说，“选中每个 <code>special</code> 类的 <code>li</code> 元素”。 你真要这样，好了，它对 <code>&lt;span&gt;</code> 还有其它元素不起作用了。你可以把这个元素再添上去就是了：</p>
 
 <pre class="brush: css">li.special,
 span.special {

@@ -468,7 +468,7 @@ <h2 id="空白">空白</h2>
 }
 </pre>
 
-<p id="Very_compact">您可以编写完全相同的CSS，删除大部分空格--这在功能上与第一个示例相同，但我相信您肯定也觉得阅读起来有点困难：</p>
+<p>您可以编写完全相同的CSS，删除大部分空格--这在功能上与第一个示例相同，但我相信您肯定也觉得阅读起来有点困难：</p>
 
 <pre class="brush: css notranslate">body {font: 1em/150% Helvetica, Arial, sans-serif; padding: 1em; margin: 0 auto; max-width: 33em;}
 @media (min-width: 70em) { body {font-size: 130%;} }