css - 有什么简单的方法可以让人们的谈话风格化吗？

Question

有时我们的网页中可能会有这样的内容:

A: How's everything going on?
B: Fine, thank you!

当句子较长时，会像:

A: How's everything going on? I haven't heard from you for a
long time. I missed you so much.
B: Fine, thank you!

但是想要的样式是:

A: How's everything going on? I haven't heard from you for a
   long time. I missed you so much.
B: Fine, thank you!

是否可以这样做:

1. 不要使用 <pre>标签。
2. 可以适应任何宽度。

Answer 1

有很多方法可以做到这一点，我的首选方法是使用像这样的定义列表:

<dl>
    <dt>How's everything going on? I haven't heard from you for a
        long time. I missed you so much.</dt>
    <dd>Fine, thank you!</dd>
    <dt>How's everything going on? I haven't heard from you for a
        long time. I missed you so much.</dt>
    <dd>Fine, thank you!</dd>
    <dt>How's everything going on? I haven't heard from you for a
        long time. I missed you so much.</dt>
    <dd>Fine, thank you!</dd>

</dl>

http://jsfiddle.net/j5v62t3n/