限制div中的单词数
是否有css属性可以限制在div.For示例中显示的字符数？
<div class ="main-text">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
</div>但我只需要展示
<div class ="main-text">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
</div>我正在使用wordpress网站的证明功能。因此，如果任何客户添加了一个证明，我只需要显示前几个字与链接。救命啊！！谢谢！！
回答 6
Stack Overflow用户
发布于 2014-05-08 07:30:09
您可以使用overflow属性(实际上有两个属性-- overflow-x, overflow-y和overflow)，还必须将width设置为div的绝对单位(读取像素或em，但不是)。
例如(CSS)：
div.main-text {overflow-x: hidden;width: 200px;}
/*This will hide everything, which goes outside of the 200px div*/此外，您还可以使用简单的PHP代码限制文本：
if (!function_exists('chop_string')) {
function chop_string($str, $len) {
if (strlen($str) < $len)
return $str;
$str = substr($str,0,$len);
if ($spc_pos = strrpos($str," "))
$str = substr($str,0,$spc_pos);
return $str . "Read more...";
}
}将上述函数放在Wordpress主题的functions.php文件中，并按如下方式使用：
<?php echo chop_string('Bla bla bla', 5); ?>
以上代码将只显示来自您的字符串和Read more...的5个字符。
编辑：
如果您想要削减标题或生成的内容来自Wordpress，那么您必须编辑您的page.php文件(也是archive.php文件)，它们在您的模板目录中。在这些文件中找到以下代码：the_content()和the_title()，这两个函数实际上显示了数据库中的所有信息。
所以像这样切：<?php echo chop_string(the_title(), 5); ?>或<?php echo chop_string(the_content(), 5); ?>
Stack Overflow用户
发布于 2014-05-08 07:36:16
有两种方法可以做到这一点：
1) CSS way
添加css属性text-overflow:ellipsis
.truncate {
width: 250px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}2) 技巧方法()
将textarea控件添加到div and add **maxlength=50**或您需要的任何东西中，使用css border:none属性隐藏边框。
Stack Overflow用户
发布于 2014-05-08 07:28:47
您可以使用css省略号。把它用在文本溢出上。它将截断，以适应您的框的宽度。
http://davidwalsh.name/css-ellipsis
http://css-tricks.com/snippets/css/truncate-string-with-ellipsis/
.main-text {
width: 250px;
}
.main-text p {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}一个限制是限制您使用一行。
https://stackoverflow.com/questions/23535329
复制相似问题
腾讯云开发者
