0

我正在使用 PHP 从 MySQL 获取段落值。我需要像这个链接一样显示。我的代码是,

<?php
        $sql = "select `content` from `content` where id='1'";
        $data = mysql_query($sql);

    while($row = mysql_fetch_array($data))
    {
        $content1 = $row[0];
    }
    $content2 = explode(" ", $content1);
    $content = "";
    $count = 1;
    foreach($content2 as $content3)
    {
        $content .= '<span id='.$count.' >'.$content3.'</span>';
        $count++;
    }

    echo "<div class='data_pre'>";
    echo $content;
    echo "</div>";
?>

我需要每个单词的跨度。但它显示相同的一行。它不会出现在下一行。请参阅链接

问题出在哪里?谢谢...

4

4 回答 4

1

哦,对不起,有: “它没有显示下一行”我确定你想让每个单词都换行。试试这个:http: //jsfiddle.net/GfVLP/13/

.data_pre span {
    display:inline-block;
    margin-right:10px;
}

http://jsfiddle.net/GfVLP/2/

你必须使用

   .data_pre span {
       display:block;
    }

因为 span 是一个内联元素

这里有一个更新,高度:140px;对父 div 而言,并非所有内容都显示 http://jsfiddle.net/GfVLP/12/

于 2013-06-17T07:19:29.353 回答
0

添加word-wrap: break-word;到您的 CSS 中!

工作小提琴:http: //jsfiddle.net/ha2At/

于 2013-06-17T07:19:01.457 回答
0

它只能用 CSS 来完成。

为此,您需要向display:inline-block跨度添加 a 以使其在行后漂移并获得跨度内容的空间,您需要向:after跨度声明一个。

这是工作解决方案

编码:

.data_pre span{display:inline-block;} /* To make the span wrap down after the line */
.data_pre span:after{content:'\0000a0';} /* To add a space in between the lines */

希望这可以帮助。

于 2013-06-17T07:24:08.440 回答
0
.data_pre span {
  display: inline-block;
  margin: 1px;
}

小提琴

于 2013-06-17T07:24:12.300 回答