标记对话（或访谈）的大多数语义方式？

Question

我正在试图找出标记这种东西的最语义方式。

John: blah blah 
Paul: blah blah 
George: blah blah 
Ringo: blah blah 

或

John:   blah blah 
Paul:   blah blah 
George: blah blah 
Ringo:  blah blah 

理想情况下，CSS可以灵活地执行或将其分解为带或不带名称可见的段落。我考虑使用before:选择器添加名称，但我也希望它们可以链接。例如，如果他有一个，我会链接到Ringo的推特个人资料。它也应该在屏幕阅读器中正确阅读。

Answer 1

HTML5规范discusses this，其要点是：

  

鼓励作者使用p元素和标点符号标记对话。我们鼓励需要标记发言人以进行样式设定的作者使用span或b。包含在i元素中的文本段落可用于标记舞台方向。

所以，最终，这样的事情：

<p><span>John:</span> blah blah</p>

<p><span>Paul:</span> blah blah</p>

<p><span>George:</span> blah blah</p>

<p><span>Ringo:</span> blah blah</p>

这样可以按照您描述的方式启用样式。当然，如有必要，您还可以添加class属性。你不直接用:before选择器将名字放在CSS中的本能是一个好的 - 这个信息肯定应该在标记中。

Answer 2

HM。

提示 - 使用xml进行标记。应该让以后更容易使用

类似于<voice speaker="John"></voice>

也许