将一行分隔成另一行？

Question

我想制作这样的文字：

看起来像这样：

texttext:      textttt
ttttttttttt:   ttt215555
textt:         trtrtrt

但是当我尝试时，它看起来像这样：

texttext: textttt
ttttttttttt: ttt215555
textt: trtrtrt

我目前正在使用的代码：

<div class="aligncenter" style="width: 700px; height: 1px; border-top: 1px dotted #999999; font-size: 0;">-</div>
Hours: Mon - Sun: 3:00 pm - 6:00 am Phone: 777777777777 Address: asd str. #14
<div class="aligncenter" style="width: 700px; height: 1px; border-top: 1px dotted #999999; font-size: 0;">-</div>

我已经解决了这个问题（wordpress）： http://jsfiddle.net/SEcfh/

<table border="0" align="left">
<tbody>
<tr>
<td style="width: 80px;">Phone:</td>
<td>+999 999 999 999</td>
</tr>
<tr>
<td style="width: 80px;">Phone:</td>
<td>+999 999 999 999</td>
</tr>
<tr>
<td style="width: 80px;">Phone:</td>
<td>+999 999 999 999</td>
</tr>
</tbody>
</table>

Answer 1

您可以使用white-space: pre或white-space: pre-wrap来保留文字中的空格。您还可以使用带有<table> s的布局作为表格数据，或使用带有固定宽度术语的定义列表<dl> / <dt> / <dd>设置。

Answer 2

您可能不想使用white-space: pre，因为您手动必须在文本中添加适量的空格。

使用具有一定宽度的跨度，用宽度为2x的div包裹，您可以轻松实现此目的。见这里：http://jsfiddle.net/qaTDN/

Answer 3

这是表格数据，为什么不把它放在<table>？

中

Answer 4

要在某个宽度后打破一行或一行，您可以使用此CSS标记：

自动换行：break-word;