对于与内容分离和语义标签表示相关的问题，使用[rdfa]，[json]，[microdata]或[microformats]将结构化元数据嵌入到HTML标记中。最常见和最重要的语义元素有四类：文档结构，文本含义，媒体类型和相关标签。语义标记正在考虑选择标签，这些标签传达关于标签标记的信息。
我正在尝试对工作进行评估。 任务是将 div 标签转换为正确的 HTML5 语义标签。我不被允许修改/删除任何其他内容。 页脚的代码是这样的： 我正在尝试对工作进行评估。 任务是将 div 标签转换为正确的 HTML5 语义标签。我不被允许修改/删除任何其他内容。 页脚的代码是这样的： <div class="footer"> <div class="copyright-content"> <div class="copyright"> copyright 20xx -xx </div> <p> by xyz company </p> </div> </div> 每个 div 进行三项单独的检查。通过第一关很容易。 <footer class="footer"> <div class="copyright-content"> <div class="copyright"> copyright 20xx -xx </div> <p> by xyz company </p> </div> </footer> 但是我无法找出下一个 div 的正确标签（带有类 copyright-content）。 我尝试了 section、article、nav、blockquote 和其他几个标签，但这些都不起作用。 我无法再重新尝试测试，但有人知道可能的正确标签是什么吗？ 这可能就是他们正在寻找的： <footer class="footer"> <small class="copyright-content"> <span class="copyright"> copyright 20xx -xx </span> <span> by xyz company </span> </small> </footer> <small>元素用于— ...旁注和小字，例如版权和法律文本... 了解（正如 Rob 指出的那样）<small> 元素不能包含 <div> 或 <p> 元素也很重要。 <small>元素只能包含短语内容，因此其他两个元素需要更改为是短语内容。 A <span> 元素 可能最适合两者。除了 <small> 赋予的语义之外，版权方和公司都不需要额外的语义。 A <span> 是措辞内容且无语义，因此非常适合。 MDN Web 文档：HTML 元素参考指南是了解所有可用标签、它们携带的语义以及如何使用（和不可以）使用它们的绝佳资源。 我一分钟前刚刚完成测试。 我也不知道那里会发生什么。 我尝试了所有我知道的标签，我尝试了（并最终得到）给定的解决方案 <footer id="copyright-container"> <small id="copyright-content"> <span class="copyright">Copyright 1999-2020.</span> <span> by Codility ® All Rights Reserved.</span> </small> </footer> 但这并不是我们所期望的。 我什至尝试过这个解决方案，但并没有更成功。 我测试得很好，提交后，我发现这是我整个3小时测试中唯一失败的答案。 很遗憾我找不到解决方案，尤其是你的帖子已经过去近两年了：P 也许将来有人能够通过它并告诉我们所期望的是什么！
相对按钮包含带有按钮的模态，它会导致 validateDOMNesting(...): <button> 不能显示为 <button>
我有按钮，看起来像 3 个点，可以用另外 2 个按钮打开模式。 我应该把这个 3 点按钮变成一个 div 吗？使代码在语义上正确的最佳决定是什么？ jsx 文件： <
我知道这个问题有很多答案，但没有一个让我满意。 有没有官方的 HTML5 方法来处理没有 href 的可点击元素？ ...
我想渲染一个配置文件用户容器，其中包含标签列表及其关联值。 以下是我想显示的信息和布局的摘录： 名字......我的名字 银...
我想知道我的一些 Web 开发人员/设计师同事认为什么是用于模态对话框（如 lightbox、superbox、thickbox 或任何您最喜欢的风格）的最佳 HTML 5 元素...
我的客户想要一个结构如下的数据表： 这个想法是表头将粘在整个表上，而帐户标题将粘在表的正下方
在 HTML 中标记标题和标语的正确方法是什么？ [已关闭]
在本节中，我有两个标题“为什么选择我们”和“加密货币的最佳选择”。 从语义和可访问性上标记这两行文本的正确方法是什么...
我应该使用什么 HTML 语义来使自定义计算器的输出易于访问？
我正在开发一个简单的计算器工具。现在，我使用带有 readonly 属性的 元素来设置计算结果的样式。然而，虽然我认为这会产生
我正在尝试使用 HTML 和 CSS 制作一个设置页面。单个设置在左侧有一个标签，在右侧有一个交互元素/多个交互元素。 我不知道什么...
我正在使用 XML 安全的 HTML5，并且想知道记录额外提示/警告/错误框的语义方式（就像技术手册中常见的那样）： 我正在使用 XML 安全的 HTML5，并且想了解记录额外提示/警告/错误框的语义方式（如技术手册中常见的内容）： <div class="info-tip" role="contentinfo"> <p><strong>Tip:</strong> Holding the control key when doing this will make life easier.</p> </div> 除非可能的话我想使用更合适的元素。我什至不确定 contentinfo 是否是一个合适的选择。 添加：我正在寻找 DITA 中 <note> 元素的 HTML5 替代品。 一些背景信息：我将使用样式表（XSLT2 和 CSS）来重新格式化内容以实现多个输出。 在developer.mozilla.org上他们只使用常规的div。 <div class="notecard note" id="sect1"> <p><strong>Note:</strong> This is the content.</p> </div> 他们页面上的示例：<dialog>元素 语义上最接近的似乎是 <details> 元素 - usage
我想知道我应该在句子或段落（比方说块）中使用哪个 html 元素来表示借用词或外语中的词，引用有效的语义。这里有一些例子... 我想知道我应该在句子或段落中使用哪个html元素（比方说<p>块）对于借用词或外语中的词，指的是有效的语义。这里有几个例子： 英语 今晚，我和一个可爱的女孩有一个约会。 （使用法语单词） 他说话的声音不大，但也没有更小声，确实mezzo voce（使用意大利语单词） 法语 Java n'est pas popriétaire，a contrario de .Net 在法语中，至少，这种外语的使用需要斜体格式。 所以我想将语义和表示结合起来。 关于语义 HTML 的维基百科文章给了我一个提示，但到目前为止我还不相信。此外，我可能无法控制 CSS，例如在文档（wiki）或描述文件（pom）中 哪个元素最适合我的要求： <i>（当然不是:)） <em>（也许不是:)） <cite> <span lang="latin"> <span class="borrowed"> 以上的组合 另一个标签 W3C说 i元素代表以替代语气或语气的一段文本，或者以其他方式偏离正常散文，以指示不同质量的文本，例如分类名称、技术术语、来自的惯用短语另一种语言、音译、思想或西方文本中的船名。 我的重点 他们的例子 <p>There is a certain <i lang="fr">je ne sais quoi</i> in the air.</p> 具有一个或多个类的span通常是最佳选择。 <span class="foreign-lang">bonjour</span> 使用CSS： span.foreign-lang{ font-style:italic; }
有时，语义包含在设计中。我的问题是，当标题层次结构的某些级别因为隐式而被跳过时，如何将此语义转换为 HTML。 例如...
所以我有一个 React 组件，其目的是：用户在输入中写入一个单词，然后按 Enter 或单击链接转到该单词的定义页面。 '使用客户端'； 导入 { FontAwesom...
我可以在 HTML5 的 img 标签中使用 href 和 rel 属性吗？
在这篇文章https://alistapart.com/article/introduction-to-rdfa/#section9中，作者说我可以直接在img标签内使用href和rel属性。我从来不知道我们可以用 html5 做到这一点......
input type="submit" 与按钮标签可以互换吗？ [重复]
input type="submit" 和按钮标签可以互换吗？或者如果有什么区别那么何时使用 input type="submit" 和何时使用按钮？ 如果没有区别那为什么我们有 2 t...
在没有 href 属性的情况下使用 <a>（锚标记）是否有效？ [重复]
我一直在使用 Twitter Bootstrap 来构建一个网站，它的很多功能都依赖于将内容包装在 中，即使它们只是要执行 Javascript。我遇到了问题
在价格细目或结账时的商品列表中使用 <dl>、<dt>、<dd> 进行语义化使用
使用 、、 标签是正确的（在语义 HTML 意义上）： 在结账页面显示价格明细？就像显示小计、税金和总计的那些。 为了... 使用 <dl>、<dt>、<dd> 标签是否正确（在语义 HTML 意义上）： 在结账页面显示价格明细？就像显示小计、税金和总计的那些。 显示订单的商品列表，当商品有对其所含内容或组成的简短说明时。例如，在汉堡结帐页面中，如果客户自定义了他/她的订单以添加一些额外的成分或类似的东西。 我在思考如何标记这个设计时遇到了这个。 通过阅读spec，在我看来它就像在建议中一样，但是，也许我在这里扭曲了一些语义？ 我想听听您对这方面规范的理解。 使用描述列表<dl>来标记小计、税额和总价是正确的。但是，由于前两项加起来等于总价格，因此该内容本质上更加表格化，而不仅仅是一组相关术语和描述。因此，我认为 <table> 更合适。 您还可以使用 <tfoot> 将最后一行封装为总计： 这通常是列的摘要，例如，列中给定数字的总和。 th { text-align: left; } td { text-align: right; } tbody th { font-weight: normal; } tfoot td { font-weight: bold; } <table> <tbody> <tr> <th scope="row">Subtotal</th> <td>$200.00</td> </tr> <tr> <th scope="row">Taxes</th> <td>$40.00</td> </tr> </tbody> <tfoot> <tr> <th scope="row">Total</th> <td>$240.00</td> </tr> </tfoot> </table>
所以这似乎是一个非常简单的问题，但我无法理解它。我有以下 HTML： 单词 1 - 单词 2 我知道这不是
假设我的网站有这一部分（创建网上商店的项目）： 显卡 &l... 假设我的网站有这一部分（创建网上商店的项目）： <section id="GraphicsCards"> <h2>Graphics Cards</h2> <section> <h3>Radeon GPUs</h3> <section> <h4>ASUS Dual Radeon RX 7800 XT OC</h4> <p>1x HDMI, 3x DisplayPort, RDNA 3</p> <img src="../media/GPUs/rx7800xt.png" alt="rx7800xt"> <p class="price">Price: € 549.00</p> <a href="./p_RX7800_details.html">More details</a> </section> </section> <section> <h3>Nvidia GPUs</h3> <section> <h4>GIGABYTE GeForce RTX 4060 EAGLE OC 8G</h4> <p>2x HDMI, 2x DisplayPort, DLSS 3</p> <img src="../media/GPUs/rtx4060.png" alt="rtx4060"> <p class="price">Price: € 349.00</p> <p>More details</p> </section> </section> </section> 更改文章中的任何内容是否有任何用处，还是我应该保持原样？我仍然有点困惑我应该使用哪一个。 研究了一些，但仍然很困惑，我可以同时使用两者，但我想确保它是正确制作的，以便当我继续研究它并使用 CSS 时，它可以正确设计。 <section>和<article>之间的主要区别在于后者... ...表示文档、页面、应用程序或站点中的独立组合，旨在可独立分发或可重用（例如，在联合组织中）。示例包括：论坛帖子、杂志或报纸文章、博客条目、产品卡、用户提交的评论、交互式小部件或小工具或任何其他独立的内容项。 — MDN Web 文档：文章内容元素 你现在所拥有的就已经很棒了。 或者，如果您希望单个规范可独立分发或可重用，您可以将那些最里面的 <section> 元素转换为 <article> 元素。两种方法都是有效的 HTML 并且语义上合理。在这种情况下，这在某种程度上是您作为作者的判断。 就我个人而言，由于这些规范块是独立的，并且如果将它们从页面中剪出以独立存在，则可以完全有意义，因此我倾向于使用<article>。但这取决于解释和作者的意图。