CSS截取字符串显示省略号

 　　有时候，为了避免页面中某个Div的内容过多，而导致页面变形，我们通常在CSs中定义overflow:hidden，这样会不显示文字，不过看上去用户体验不太好，为了获得最佳的用户体验，我们在隐藏文字的同时，可以在文字后边显示省略号，CSS中有现成的方法可以用，比如下面对CSS的定义：

　　1/*CSS代码如下：*/

　　2show{

　　3overflow:hidden;

　　4white-space:nowrap;

　　5text-overflow:ellipsis;

　　6/*为你显示文字的div添加宽度定义，当超出宽度时会自动添加省略号*/

　　7width:30px;

　　8}

　　在上述代码中，text-overflow:ellipsis就是显示省略号的，很不错吧?

时间： 2024-08-03 22:53:47

CSS截取字符串显示省略号的相关文章

用css截取字符串长度的方法

有时我们在做页面展示的时候,会遇到文章标题字符过多的问题,需要截取一定长度并后面用省略号代替.这个可以用css来实现.不过在火狐浏览器上不显示省略号,用时要注意兼容性.  代码如下 复制代码  <style type="text/css"> .cutLen{...}{     width:200px;     overflow:hidden;     white-space:nowrap;     text-overflow:ellipsis; } </style&g

css 溢出文本显示省略号各种方法总结

语法: text-overflow : clip | ellipsis 参数: clip : 不显示省略标记(...),而是简单的裁切 (clip这个参数是不常用的!) ellipsis : 当对象内文本溢出时显示省略标记(...) 说明: 设置或检索是否使用一个省略标记(...)标示对象内文本的溢出. 请您注意,text-overflow:ellipsis属性在FF中是没有效果的. 示例: div { text-overflow : clip; } text-overflow是一个比较特殊的样

当内容超出最大的长度的时候，使用CSS使文本显示省略号

.description{  height:17px;  overflow:hidden;  text-overflow:ellipsis;  -webkit-text-overflow:ellipsis;  -o-text-overflow:ellipsis;  white-space:nowrap; }

php获取字符串的长度及截取字符串

三.获取字符串的长度:strlen()函数 语法: int strlen(string str); 例: <?php echo strlen("www.bianceng.cn");?> 四.截取字符串:substr()函数 语法: substr(要截取的字符串,开始截取的位置,截取字符的个数) 例: <?php $a="www.bianceng.cn"; echo substr($a,13,2); //输出 cn?> 以上是小编为您精心准备的

JS和CSS限制页面显示的字符长度

<nav class="cf_nav clearfix"> <ul> <li> <a href="http://lizhuangs.18021051d350c3871c0a.tpl.diandian.com" title="首页"> <div class="nav_block"> <span>首页</span> <span class=&

css-纯CSS控制超出部分显示省略号

问题描述 纯CSS控制超出部分显示省略号 RT: 内容只有一行的时候可以控制,但是多行内容就没法了.怎么实现呢?求大神给点思路,实在没有C币,还望谅解. 解决方案 .title { overflow: hidden; font-size: 1.4rem; color: #000; display: -webkit-box; -webkit-line-clamp: 1; //控制行数 -webkit-box-orient: vertical; line-height: 1.8rem; height

ThinkPHP的截取字符串函数无法显示省略号的解决方法_php实例

对于ThinkPHP的截取字符串函数无法显示省略号的情况,解决方法如下: 打开Common/extend.php页面,修改msubstr函数如下: function msubstr($str, $start=0, $length, $charset="utf-8", $suffix=true) { if(function_exists("mb_substr")) { if($suffix) { if($str==mb_substr($str, $start, $le

截取固定长度字符串显示在页面，多余部分显示为省略号(区分汉字和字符)

汉字|显示|页面|字符串|字符串 以下是代码,呵呵,比较简单,主要是区分汉字和字母,不然一个全是字母,一个全是汉字的两条记录排列在一起时会比较难看,全字符的长度只有全汉字 的一半就显示...号了     public static string stringformat(string str,int n)                {                        ///                        ///格式化字符串长度,超出部分显示省略号,区分汉字跟字母

如何继续截取长文本显示省略号（多行）

记得第一篇博客写过单行文本溢出显示省略号,今天就来说说多行文本溢出怎么显示省略号吧 其实也是前些日子做移动端的页面接到这么个需求,本来以为这没法实现,同事跟我说-webkit-line-clamp属性可以,就去查了查,果然 Pc端基本不会有这种需求,因为这个方法兼容性太差,浏览器份额不是webkit占大头(特别是天朝),看前缀就知道只支持webkit内核,他属于webkit内部属性,和-webkit-text-size-adjust: none(这个Pc端已经不在支持,移动端还可以使用)类似,但