将字符串截断为多行

时间:2014-09-12 23:23:37

标签: jquery html

我在mySQL中有一个表,其中包含一个包含许多字符(超过100个)的字段,它是一个文本。我想在<div>

中显示我的文字
<div id="moreinformation" style="background-color:#8158BE; width:626px; height:150px; position:absolute; left:2px; top:750px">
    <label id="text" style="position:absolute;left:5px;top:2px;color:white;font: 15px Arial, Helvetica, sans-serif;">
         Autre informations : 
    </label>
    <p style="position:absolute; left:5px; top:20px; color:white; font:15px Arial, Helvetica, sans-serif;">
         this is an exemple of the text blablabla blablabla 
    </p>
</div>  

标识为<label>的{​​{1}}是我要放置文字的地方。问题是我不知道如何剪切我的文本以在不同的行中显示它并保持正确的单词形式。这里的主要问题是我得到溢出所有文本写在同一行。我需要你的帮助,请使用CSS或jQuery。

2 个答案:

答案 0 :(得分:0)

您可以为<p>标记设置特定宽度,文本应换行到下一行。但是,您应该考虑使用CSS来设置页面样式,如下所示:

CSS

#moreinformation {
    background-color: #8158BE;
    width: 626px;
    height: 150px;
    position: absolute;
    left: 2px;
    top: 750px;
}
#text {
    position: absolute;
    left: 5px;
    top: 2px;
    color: white;
    font: 15px Arial, Helvetica, sans-serif;
}
p {
    position: absolute;
    left: 5px;
    top: 20px;
    color: white;
    font: 15px Arial, Helvetica, sans-serif;
    width: 450px;
    display: block;
    word-wrap: normal;
}

HTML

<div id="moreinformation">
    <label id="text">Autre informations :</label>
    <p>this is an exemple of the text blablabla blablabla</p>
</div>

答案 1 :(得分:0)

我不能100%确定您要求的内容,但如果问题是文本在数据库中有换行符并且您需要显示这些换行符,请在CSS中使用此< / p>

label {white-space:pre-wrap;}