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!

是否可以通过以下方式执行此操作：

请勿使用<pre>标记。
可以适合任何宽度。

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/

Answer 2

有很多方法：）

.parent{
  width: 200px;
  display:flex;
  font-family: sans-serif;
}
.parent>div{
  padding: 0 5px;
}

<div class="parent">
  <div>
    A:
  </div>
  <div>
    How's everything going on? I haven't heard from you for a long time. I missed you so much.
  </div>
</div>

有没有简单的方式来塑造人们的谈话风格？

2 个答案: