您可以使用W3C验证服务来检查HTML文档，CSS样式表，Atom / RSS源等。
我的网站已通过W3C验证，现在我需要将H4标签放在主页的某个超链接上。当我放置 H4 标签时，W3C 考试中出现一些错误。那么如何在链接上放置 H4 标签呢？ 这里...
我正在转换应用程序以符合 W3 辅助功能指南。 我需要让屏幕阅读器一起读取标题和值，仅使用 标签。 这个网站... 我正在转换应用程序以符合 W3 辅助功能指南。 我需要让屏幕阅读器一起读取标题和值，仅使用 <p> 标签。 该网站有多个显示为只读的表单，如果用户希望编辑字段，则必须单击“编辑”按钮以打开模式。 我对只读字段的问题是，该网站的结构是标题显示在左侧，相应的值显示在右侧。像这样的东西： <div class="form-group" id="-serviceName"> <p id="-title" class="col-sm-4 form-control-title">Some text</p> <p id="-value" class="col-sm-8 form-control-static">Some value</p> </div> 最初我使用的是<label>，但是当我打开页面时，我的值不是输入，WAVE 评估工具向我发出警报： “孤立的表单标签：存在表单标签，但未与表单控件正确关联。” <div class="form-group" id="-serviceName"> <label class="col-sm-4 control-label" id="-label">Some text</label> <div class="col-sm-8 col-md-6 col-lg-4"> <p class="form-control-static" id="-value">Some value</p> </div> </div> 我尝试过使用aria-labeledby和aria-describedby，但是使用箭头键，屏幕阅读器始终独立地呈现信息。 首先它显示“一些文本”，然后我必须再次单击箭头键，它显示“一些值”。 我想让屏幕阅读器将两个值一起读取为：“某些文本某些值” 就屏幕阅读器的使用而言，您已有的代码不应该存在重大问题。 他们可以很好地访问键值对，并且它将按顺序读取它们，这将首先读取标题，然后读取值（向下读取时）。 当涉及到WCAG 标准信息和关系时，使用<p>可能不足以解释第二个文本是用户输入，而第一个文本是用户无法更改的静态标签。 可能有几种有效的方法可以解决这个问题。 推荐解决方案 如果这是表单数据，用户可能期望（取决于您的用例）以表单而不是阅读模式进行导航。因此，他们可能会使用 Tab 键从一个表单字段跳转到另一个表单字段。 目前“表单”中没有表单字段。我推荐的解决方案是真正的readonly形式： <form aria-labelledby="form-title"> <h2 id="form-title">Your form data</h2> <p> <label>Some text <input readonly type="text" value="Some value"> </label> </p> <p><button>Edit</button></p> </form> 这也将清楚地传达给任何辅助技术，我们正在处理表单数据，但在当前状态下无法更改。表单必须有一个可访问的名称，这就是为什么我用 aria-labelledby 来指代可见标题。 <label>元素必须与表单输入关联，可以通过for属性或通过包装输入来关联。 替代解决方案 将两篇文章放在一起<p>加强了它们的关系，并且在使用屏幕阅读器阅读时，标题和值之间的停顿更少 <p class="form-group" id="a2ba84-serviceName"> <div id="a2ba84-title" class="col-sm-4 form-control-title">Some text</div> <div id="a2ba84-value" class="col-sm-8 form-control-static">Some value</div> </p> <dl>描述列表旨在形成一组键和值，并且经常在这种情况下使用 <dl> <div class="form-group" id="a2ba84-serviceName"> <dt id="a2ba84-title" class="col-sm-4 form-control-title">Some text</dt> <dd id="a2ba84-value" class="col-sm-8 form-control-static">Some value</dd> </div> </dl> 补充说明 aria-labelledby 和 aria-describedby 不能仅用于任何元素。它们用于具有可访问名称的ARIA 角色，主要是交互式控件、地标和表格元素。
我的公司正在构建一个网站，我们遇到了一些 JavaScript 库无法替换某些内容的问题。我们决定将 HTML 放入 W3C 验证器，它告诉我们这是非法的......
为什么前端框架可以创建自定义属性，但我希望在我的前面添加“data-”
为什么前端框架能够在 html 元素上创建自定义属性，例如 以 Vue 为例 如果我自己编造的话，Html 验证器就会抱怨。 为什么前端框架能够在 html 元素上创建自定义属性，例如 以 Vue 为例 <div v-for="..."> 如果我自己编写，Html 验证器会抱怨。 <div something> 告诉我我应该像这样假装数据 <div data-something> 我了解一致性和标准的重要性。但我很好奇前端框架是否在幕后做一些特殊的事情来规避这个规则。 或者他们只是忽略了它？ 关于Vue： 您为 Vue 提供的 HTML 不是渲染的 HTML。它由 Vue 编译成创建虚拟 DOM 的 JS 代码。然后，Vue 默认渲染器将其转换为实际的“正确”HTML，而无需 v-for 和其他指令。 如果您想验证 HTML - 验证呈现的 HTML 页面。 Vue 模板是伪 HTML，有助于为虚拟 DOM 创建渲染功能，从而提高可读性并让设计师等非程序员参与其中。 我想其他框架也是如此 - 您应该验证最终渲染的 HTML。
向 Web 应用程序的所有 HTML 元素添加 ID 属性？
目前我正在使用 RoR、MySQL、HTML、CSS 和 jQuery 等构建一个 Web 门户，我收到自动化测试工程师的请求，要求向所有
如何修复“错误：在前 512 个字节之后找到元元素上的字符集属性。”
我的网站在验证时遇到此错误。 错误：在前 512 个字节之后找到元元素的字符集属性。 这是导致此问题的代码： <...
我习惯于对 Brackets 文本编辑器进行编程，并且我已经安装了 W3C 验证器，但它在我在线时可以工作，但在离线时却不能。我尝试安装 https://validator.w3.org/docs/install.html 并且我...
我在选框标签中有一些文字。 测试测试测试测试测试 我正在使用 html 5 和 css 3。当我在 w3c 验证器中检查我的 html 时，它
我想这是一个标准问题，而不是一个特定的编码问题。 我想知道是否需要使用 W3C HTML 验证之类的工具来验证 HTML？如果我发送 DOCTYPE 和 META t...
请帮助我解决此验证错误。我不明白这意味着什么，或者我的 HTML 不符合标准。 我会在这里重新发布它，因为希望我能修复它，并且该链接不会...
可能的重复： 我真的需要将 '&' 编码为 ' &' 吗？ 我知道 W3C 建议“使用“&”（ASCII 十进制 38）而不是“&”以避免混淆...
我无法让我的网站在 W3C 标记验证中进行验证。 这是验证错误之一的示例。 错误：此处不允许使用属性 xmlns:content。 我做了一些研究...
W3C 验证器给出 XHTML 的“文档类型不允许元素在此处“输入”...”错误
我在使用 W3C 验证器验证我的页面时遇到此错误。 来源： 可以一些...
validator.w3.org 认为以下有效 HTML： 测试...</desc> <question vote="0"> <p>validator.w3.org 认为以下有效 HTML：</p> <pre><code><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Test</title> </head> <body> <div>This <<<<<<<<<<<<<<<<<<<<<<b>is</b> a test.</div> </body> </html> </code></pre> <p>真的有效吗？</p> </question> <answer tick="true" vote="3"> <p>是的，标签只会被视为附加文本。它不是 HTML 标记的一部分。</p> <p>它只是打印</p> <blockquote> <p>这<<<<<<<<<<<<<<<<<<<<<<strong>是</strong>一个测试。</p> </blockquote> <p>这没有什么问题。</p> </answer> <answer tick="false" vote="2"> <p>此代码已使用 W3C 验证器成功验证。并且该页面将按预期显示在所有主要浏览器（Firefox、Opera、Chrome 和 Internet Explorer）上。</p> <p>您可以在这里查看结果：<a href="http://validator.w3.org/" rel="nofollow">http://validator.w3.org/</a></p> </answer> <answer tick="false" vote="2"> <p>验证为 HTML 时允许，但验证为 XHTML 时不允许。</p> <p>这里您需要使用<pre><code><</code></pre>和<pre><code>></code></pre>，无论如何这是最佳实践。</p> </answer> <answer tick="false" vote="0"> <p>我在 w3c 中测试了你的代码。根据 w3c 标准，它完全有效:)</p> <p>但是使用 HTML 实体始终是一个很好的做法。你可以写“<" or "<" in spite of writing ">”。我们使用 HTML 实体来确保所有浏览器和平台的准确结果。 参考：<a href="http://www.w3schools.com/html/html_entities.asp" rel="nofollow">http://www.w3schools.com/html/html_entities.asp</a></p> <p>最诚挚的问候， 图希德</p> </answer> </body></html>
经过一番研究，我了解到标签在 HTML 中给出了其内容的定义。喜欢 这是一个部分 这是一篇文章 所以如果我写...
我刚刚阅读了 HTML5 作者规范。 它指出 、 和 标签是可选的。 这是否意味着您可以完全将它们排除在外，并且仍然拥有
JTidy (HTML-Tidy) 在 w3c HTML 验证器上使用的配置
我正在使用 JTidy（HTML Tidy 库的 java 端口）来清理一些现有站点。当我使用 JTidy 时，我的配置似乎非常严格，最终切断了 pa 的底部...
'charset=iso-8859-1' 与 <!DOCTYPE HTML> 发出警告
我刚刚使用 W3C 验证器验证了 HTML 文档，发现如果我使用： 和： 我刚刚使用 W3C 验证器验证了 HTML 文档，发现如果我使用： <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 与： <!DOCTYPE HTML> 它会发出警告Line 4, Column 72: Using windows-1252 instead of the declared encoding iso-8859-1. 但是，如果我使用： <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 我真的不明白发生了什么。另外，我什至不知道如何使用 DOCTYPE 标签，我只是从网络上复制并粘贴了一个标签。 为什么会出现这种情况？ 我应该如何使用DOCTYPE标签？ 更改 DOCTYPE 只是关闭警告 - 它实际上并没有修复任何问题。 iso-8859-1 和 windows-1252 是非常相似的编码。它们的区别仅在于与从 0x80 到 0x9F 的 32 字节值关联的字符，这些字符在 iso-8859-1 中映射到控制字符，在 windows-1252 中映射到一些有用的字符，例如欧元符号。 控制字符在 HTML 中毫无用处，网络作者经常错误地声明 iso-8859-1，但却像使用 windows-1252 一样使用这 32 个值中的一个或多个，因此浏览器在看到声明的 iso-8859-1 字符集时会自动将其更改为 windows-1252。 验证器只是警告您这种情况将会发生。如果您没有使用任何 32 字节值，那么您可以简单地忽略该警告 - 这“不是”错误。如果是，并且您确实想要字节值的 iso-8859-1 解释而不是 windows-1252 解释，那么您就做错了。同样，这种切换发生在任何 DOCTYPE 的浏览器中，只是 HTML5 验证器比 HTML4 验证器更能帮助您了解它所告诉您的内容。 几点： 任何 HTML5 验证都应该持保留态度。该规范仍在积极开发中，并非一切都是一成不变的。 您正在为该元标记使用 HTML4 语法。试试<meta charset="iso-8859-1"> 也就是说，HTML 验证器在当今时代没有多大用处。 但显然 HTML4 的默认值是 iso=8869-1。也就是说，HTML5 的默认字符集是 UTF-8。 有关 HTML5 文档类型的更多信息可以在 John Resig 的 这篇文章 中找到。 它会发出警告Line 4, Column 72: Using windows-1252 instead of the declared encoding iso-8859-1. 这意味着文件在创建时使用编码 Windows-1252 保存（又名 Western Windows 1252 或 CP1252），并且您的 charset 声明显示“嘿，请使用 ISO 8859-1 读取此文件”，而这不是文件的编码有。 元字符集正是出于这个原因而存在。它的存在是为了声明您正在发送/读取/使用的文件的编码，因此当浏览器读取文档时，它知道该文件正在使用什么编码。 详细来说，您已声明此字符集： <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 但是您正在验证的文件实际上是在 Windows-1252 中编码的。如何？为什么？检查您正在使用的文本编辑器以及它使用什么编码来保存文件。如果编辑器可以配置为更改编码，请选择您要使用的编码。 关于 HTML5 使用 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 或 <meta charset="iso-8859-1"> 都对 HTML5 有效。请参阅 与 W3C 验证器提供验证器使用的编码选项。您已在文档中指定编码，因此运行验证器后，您应该在顶部信息块中看到“编码：iso-8859-1”。 在其右侧，有一个下拉菜单。将选项从“（自动检测）”更改为“iso-8859-1（西欧）”。然后，验证器将使用 ISO 8859-1 而不是自己的选择，并且您将不会收到错误。 执行以下操作： ISO 8859-15。是的，-15，它会起作用。 不要在验证器上放置太多库存。通常有太多的 Internet Explorer 解决方法，特别是在 CSS 内容中，这会导致验证器出错。如果您的页面可以在所有浏览器中运行并且您的客户满意，那么某些验证器说什么并不重要。 如果您指定 HTML5 doctype，那么您应该与元字符集属性保持一致。在你的页面上尝试一下这个： <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"> </head> <body> </body> </html>
考虑到 和 是内联元素，而 是块元素，那么在不使用脚本的情况下将 嵌套在跨度/标签内的正确方法是什么？ 我... 鉴于 <label> 和 <span> 是内联元素，而 <ol> 是块元素，那么在不使用脚本的情况下将 <ol> 嵌套在跨度/标签内的正确方法是什么？ input { vertical-align: top; } label { display: block; } label + label { margin-top: 1em; } ol { padding:0; margin:0; } <label for="foo"> <input id="foo" type="checkbox" /> <span style="padding-left: 1em; display:inline-block;"> <ol> <li>Boat</li> <li>Jet</li> <li>Chopper</li> </ol> </span> </label> <label for="bar"> <input id="bar" type="checkbox" /> <span style="padding-left: 1em; display:inline-block;"> <ol> <li>Car</li> <li>Auto</li> </ol> </span> </label> 目标是拥有一个自动排序的列表，它不依赖于 JavaScript，这也被认为是 W3C XHTML 有效的。 您可以使用图像映射 (map) 来包含您的列表，但这可能会滥用 map 标签。 我的意思是这样的： <label for="foo" style="padding:1em;display:inline-block;"> <map id="foolist"> <ol> <li>1</li> <li>2</li> <li>3</li> </ol> </map> </label> <input name="foo" id="foo" type="checkbox" /> 编辑：W3C 声明 map 属性是块级： MAP 元素内容模型允许 作者结合以下内容： 一个或多个 AREA 元素。 这些元素没有内容，但是 指定几何区域 图像映射和关联的链接 每个地区。请注意，用户代理会 通常不渲染 AREA 元素。 因此，作者必须提供 每个区域的替代文本 alt 属性（参见下文 有关如何指定的信息 替代文本）。 块级 内容。 该内容应包括 A 指定几何元素 图像映射的区域和链接 与每个区域相关。注意 用户代理应该呈现 MAP 元素的块级内容。 作者应该使用此方法 创建更易于访问的文档。 既然没有人回答，我就尝试一下： 使用 span 手动创建列表 <label for="foo"> <span style="padding:1em;display:inline-block;"> <span class="ol"> <br /><span class="li">1. 1</span> <br /><span class="li">2. 2</span> <br /><span class="li">3. 3</span> </span> </span> </label> 在 CSS 中看到 ol{...} 或 li{...} 的每个地方，您都必须插入该类； ol,.ol{...}和li,.li{...}。此外，.ol可能需要有display:block; 换行符可能会被替换为清晰的，但这都是我的想法，没有测试。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="description" content="" /> <meta name="keywords" content="" /> <title>foo</title> <style type="text/css"> /*<![CDATA[*/ span.c1 {padding:1em;display:inline-block;} /*]]>*/ </style> </head> <body> <ol> <li><label for="foo"><span class="c1">1</span></label></li> <li><label for="foo"><span class="c1">2</span></label></li> <li><label for="foo"><span class="c1">3</span></label></li> </ol> </body> </html>