替代DOA< di& gt;标签 [英] Replacement for the DOA <di> tag

问题描述

DOA(或更恰当地说，在到达之前失效) )表明XHTML2支持 < di> 标记.

[...]可以将术语及其定义分组在 di 元素内，以帮助阐明术语及其定义之间的关系.

为澄清起见，此标签将用于将< dt> 和< dd> 标签分组到< dl> :

 < dl>< di>< dt>确定</dt>< dd>穿过窗口或从窗口弹出；"XHTML2被防御了"</dd>< dd>如果网络标准继续按原样进行，我会怎么做</dd></di></dl> 

无论如何，由于< di> 不在窗口中( heh )，所以我想知道当前支持的标记( )模式可以描述为在语义和结构上等效吗?我从本质上已经接受< dl> 不足以满足我的要求(就美学要求而言， )，因此我将继续研究其他解决方案.

我对< di> 的意图主要是样式钩子 1 ，因为我使用的是定义列表，并打算将术语/定义分组设置为样式单项.

为了便于访问，我将使用 aria-* 和 role 属性来帮助定义关系，但我希望通常存在一些可以用来模拟< di> 的结构，而我只是没有遇到过.

例如，我正在考虑以下内容:

 < ul>< li>< dfn id ="term-1"> term</dfn>< p aria-labelledby ="term-1">术语1</p>的定义< p aria-labelledby ="term-1">术语1的另一个定义.</li>< li>< dfn id ="term-2"> term</dfn>< p aria-labelledby ="term-2">术语2</p>的定义< p aria-labelledby ="term-2">术语2的另一个定义.</li></ul> 

_{1.据我了解，这是经常将其从HTML5中排除的原因(它只是一个样式钩子).坦率地说，我认为这很牛，因为这是出于美学和解析目的而对术语和定义进行分组的一种完全合理的方法.但是谁在乎呢?未加引号的属性和不完整的标签更为重要.</sarcasm>}

解决方案

HTML5 CR在

 < dl>< div>< dt>确定</dt>< dd>穿过窗口或从窗口弹出；"XHTML2被防御了"</dd>< dd>如果网络标准继续按原样进行，我会怎么做</dd></div>< div>< dt>实用HTML</dt>< dd>根据浏览器中的实际工作方式使用标记和其他相关软件</dd></div></dl> 

浏览器对此进行解析，以使 div 元素是 dl 元素以及 dt 和 dd 的子元素.元素仍然对默认格式具有正常作用.

现在您可以设置单位的样式，例如

 < style>dl>div {边框:红色常亮1px;底边距:0.6em;}</style> 

您可能为此而感到恼火.一种更安全，更迟钝的方法是将每个单元单独设置为 dl 元素(如果需要处理，将 dl 元素包装在 div 容器中)并将它们全部作为一个元素.

The DOA (or more appropriately, Dead Before Arrival) XHTML2 working standard indicates support for the <di> tag.

[...] The term and its definition can be grouped within a di element to help clarify the relationship between a term and its definition(s).

To clarify, this tag would be used to group <dt> and <dd> tags together under a <dl>:

<dl>
    <di>
        <dt>defenestrate</dt>
        <dd>throw through or out of the window; "XHTML2 was defenestrated"</dd>
        <dd>what I will do if web standards keep going they way they are</dd>
    </di>
</dl>

Anyway, since <di> is out the window (heh), I was wondering what (if any) currently supported markup patterns could be described as semantically and structurally equivalent? I've essentially accepted that <dl> is not sufficient for my requirements (as far as aesthetic requirements go), so I'm on to looking at other solutions.

My intent for <di> was primarily a style hook¹, as I'm using a definition list and intend to style the term/definition groupings as a single item.

For the sake of accessibility, I will be using the aria-* and role attributes to help define the relationship, but I'm hoping that there exists some generally accepted structure to emulate <di>, that I simply haven't encountered.

For example, I'm considering something like the following:

<ul>
    <li>
        <dfn id="term-1">term</dfn>
        <p aria-labelledby="term-1">definition for term 1</p>
        <p aria-labelledby="term-1">another definition for term 1</p>
    </li>
    <li>
        <dfn id="term-2">term</dfn>
        <p aria-labelledby="term-2">definition for term 2</p>
        <p aria-labelledby="term-2">another definition for term 2</p>
    </li>
</ul>

_{1. As I understand it, this is an oft-cited reason for its exclusion from HTML5 (that it is merely a style hook). Frankly, I think that's bull since it is a perfectly reasonable way to group terms and definitions for both aesthetic and parsing purposes. But who cares, right? Unquoted attributes and incomplete tags are far more important.</sarcasm>}

解决方案

HTML5 CR defines a grouping within a dl element, so that e.g. a dd element followed by one or more dd elements constitutes a group, the next dd starts a new group etc. In this sense, the di element would be structurally redundant. On the other hand, a dl element has really no semantics (beyond being structurally something), and there is no known software that processes it in any particular way, beyond default rendering issues.

If you wish to style such a group as a unit, you are mostly out of luck, as per specs and drafts. There is no proposal being considered about adding anything like di. You might submit a proposal, referring to tbody and optgroup as precedents (i.e. as special-purpose grouping elements within specific elements), but that would be a long way.

A short way is to use div for grouping inside dl. Of course it’s "invalid", but that’s just a formal position, and browsers don’t really care. They seem to digest this fine:

<dl>
    <div>
        <dt>defenestrate</dt>
        <dd>throw through or out of the window; "XHTML2 was defenestrated"</dd>
        <dd>what I will do if web standards keep going they way they are</dd>
    </div>
    <div>
        <dt>pragmatic HTML</dt>
        <dd>using markup according to how things actually work in browsers
            and other relevant software</dd>
    </div>
</dl>

Browsers parse this so that div elements are children of the dl element, and the dt and dd elements still have their normal effect on default formatting.

And now you can style the units, e.g.

<style>
dl > div { border: solid red 1px; margin-bottom: 0.6em; }
</style>

You may get flamed for this. A safer, duller approach is to make each unit a separate dl element (and wrap the dl elements in a div container if you need to deal with the all of them as a single element).

这篇关于替代DOA&lt; di&amp; gt;标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！