如何获得符合列表样式类型样式规则的HTML定义列表?

Joe*_*ier 5 css

所以我正在标记客户的网页设计.该页面是常见问题解答页面,其中每个常见问题解答部分都有一个问题和答案列表.此方案的最合适的语义标记是html定义列表.

客户端的模型还会在每个问题/答案对旁边显示数字,例如有序列表.

所以我自然认为我只是用<dl>元素标记内容,并使用CSS添加list-style-type: decimal.但是,这完全被忽略了.

是因为<dl>元素不能接受列表样式吗?这看起来非常倒退,因为它毕竟是一个列表元素!

或者我的标记做错了什么?

这是我的代码CSS和HTML的一个例子:

dl { list-style: decimal; }
Run Code Online (Sandbox Code Playgroud)
<dl class="some-list">

  <dt><strong>Q</strong>: How Do I Do Some Thing?</dt>
  <dd><p><strong>A:</strong> You just do it, okay? Want a longer explanation? Try this: You just do it, okay? Want a longer explanation? Try this: You just do it, okay? Want a longer explanation? Try this: You just do it, okay? Want a longer explanation? Try this:</p>
  </dd>

  <dt><strong>Q</strong>: How Do I Do Some Other Thing?</dt>
  <dd><p><strong>A:</strong> You just do it, okay? Want a longer explanation? Try this: You just do it, okay? Want a longer explanation? Try this: You just do it, okay? Want a longer explanation? Try this: You just do it, okay? Want a longer explanation? Try this:</p>
  </dd>

</dl>
Run Code Online (Sandbox Code Playgroud)

Nic*_*oud 8

来自Mozilla文档:

list-style-type CSS属性指定列表项元素的外观.由于它是唯一默认显示:list-item的人,这通常是<li>元素,但可以是具有此显示值的任何元素.

您可以将display:list-item您的dt元素在CSS,然后也适用一个list-style-type选项,以它为好.

dt.wanna-be-list {
  display:list-item;
  list-style-type: square;
}
Run Code Online (Sandbox Code Playgroud)