HTML中的空白格式问题

时间:2011-11-17 19:27:59

标签: php html whitespace

我选择的数据包含(可以是一个长字符串和'white-space'),

示例:

$row['desc'] = 'abcd       ABCD   1234 more..  "

<td><?=$row['desc']?></td>

但是当我在浏览器的HTML表格中显示它时,我没有看到像数据库中那样格式化的空白区域。我想保留数据库中的格式。

在FireBug中,我看到与数据库中完全相同的数据格式。

[*]保留选定数据等格式,我试过

  $display_desc = array(" ","&nbsp;",$row['desc'])

我的$row['desc']是动态字符串

但是,如果我喜欢它会在$row['desc']长字符串没有包装时出现问题。

任何人都知道这种情况下的问题是什么?

由于

HTML中的EDIT示例

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>test Document</title>
</head>

<body>
<table border="1">
  <tr>
    <td>Short data</td>
  <td style="WORD-BREAK:BREAK-ALL;">
  long data      long data     long data     long data     long data     long data     long data    long data    long data  long data  long data      long data     long data     long data     long data     long data     long data    long data    long data  long data data     long data     long data     long data     long data    long data    long data  long data data     long data     long data     long data     long data    long data    long data  long data data     long data     long data     long data     long data    long data    long data  long data data     long data     long data     long data     long data    long data    long data  long data data     long data     long data     long data     long data    long data    long data  long data data     long data     long data     long data     long data    long data    long data  long data 
  </td>
    <td style="WORD-BREAK:BREAK-ALL;">
  long data      long data     long data     long data     long data     long data     long data    long data    long data  long data  long data      long data     long data     long data     long data     long data     long data    long data    long data  long data data     long data     long data     long data     long data    long data    long data  long data data     long data     long data     long data     long data    long data    long data  long data data     long data     long data     long data     long data    long data    long data  long data data     long data     long data     long data     long data    long data    long data  long data data     long data     long data     long data     long data    long data    long data  long data data     long data     long data     long data     long data    long data    long data  long data 
  </td>

</table>
</body>
</html>

3 个答案:

答案 0 :(得分:2)

换入<pre>代码然后应用一些css:How do I wrap text in a pre tag?

pre {
 white-space: pre-wrap;       /* css-3 */
 white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
 white-space: -pre-wrap;      /* Opera 4-6 */
 white-space: -o-pre-wrap;    /* Opera 7 */
 word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

使用您的示例html进行演示:http://jsfiddle.net/B98jc/

答案 1 :(得分:1)

浏览器将两个或更多个常规空格转换为单个空格。

使用非中断空格(&nbsp;)代替告诉浏览器呈现所有空格字符。如果您遇到包装问题,可以使用CSS控制它。但请记住,浏览器希望打破可能会破坏的事物,就像常规空间一样。您可能必须在这些不间断的空格中插入一个常规空间(或使用一些奇特的JavaScript)来控制包装。

话虽如此,似乎您想要构建一个模仿来自数据库的表结构。将您的$row记录中的整个字符串放入单个表格单元格并不能真正解决该问题。您的数据看起来像是固定宽度格式,因此您可能需要遍历每一行数据并为第一列获取第一个 x 字符,下一个 x 第二列的字符,依此类推。

答案 2 :(得分:0)

为什么不直接将输出包装在<pre>标签中?这将保留您现有的格式。

走这条路是否有问题?或者您需要更换空格吗?