1. 使用text-overflow:ellipsis对溢出文本显示省略号有两个好处,一是不用通过程序限定字数;二是有利于SEO。需要使用对对溢出文本显示省略号的通常是文章标题列表,这样处理对搜索引擎更友好,因为标题实际上并未被截字,而是局限于宽度而未被显示而已。
  2.  
  3. 通常的做法是这样的:
    1.overflow:hidden;
    2.text-overflow:ellipsis;
    3.-o-text-overflow:ellipsis;
    4.white-space:nowrap;
    5.width:100%;
  4.  
  5. 其中,overflow: hiddenwhite-space: nowrap都是必须的否则不会显示省略号;-o-text-overflow: ellipsis针对Opera;而宽度的设定主要是针对IE6
  6.  
  7. 该方法支持Internet Explorer, Safari, Chrome Opera,但FF并不支持,不过可以通过Jquery来实现类似的效果。
  8.  
  9. 下载这个Jquery插件:jQuery ellipsis plugin
  10.  
  11. 调用方法:
    1.$(document).ready(function() {
    2. $('.ellipsis').ellipsis();
    3.}

使用text-overflow:ellipsis对溢出文本显示省略号有两个好处的更多相关文章

  1. text-overflow:ellipsis ,溢出文本显示省略号

    text-overflow:ellipsis 对溢出文本显示省略号有两个好处, 一是不用通过程序限定字数 二是有利于SEO. 需要使用对对溢出文本显示省略号的通常是文章标题列表,这样处理对搜索引擎更友 ...

  2. CSS 单行溢出文本显示省略号...的方法(兼容IE FF)(转)

    http://www.52css.com/article.asp?id=602 ===================================================     html ...

  3. css 溢出文本显示省略号

    这个标题其实已经是一个老生常谈的问题了.很多时候,比如网站最基本的文章列表,标题会很长,而显示列表的区域宽度却没有这么宽,这时候最正常的做法就是 让超出宽度的部分文字用省略号(…)来表示.通常做法是网 ...

  4. 新公司入职第一天遇到的 关于 CSS 单行溢出文本显示省略号...的问题

    上班第一天 前端岗位,因为公司这个项目是标准开发 所以没法用框架在打架页面,好吧 我手写 各种div 各种css样式 好不忧伤,好吧 不废话了 进入正题. 想在导航栏中的 客户信息 功能点 实现溢出用 ...

  5. css text-overflow溢出文本显示省略号

    <div style="width: 100px; overflow: hidden; text-overflow:ellipsis"> <nobr>当对象 ...

  6. css溢出文本显示省略号

    css div { width: 200px; height: 200px; border: 1px solid; /* 以下四条缺一不可 其中 display:block 为隐藏条件 */ disp ...

  7. 使用 text-overflow: ellipsis溢出文本显示省略号时碰到的小问题

    本人刚刚实习,第一次写东西,希望大家多多鼓励. 项目中需要实现标题超过一定长度以省略号的形式显示,不是什么难的问题.可是我不想用js实现,就百度了发现text-overflow: ellipsis;( ...

  8. CSS基础:text-overflow:ellipsis溢出文本显示省略号的详细方法_CSS教程

    4要素: width: 125px;  //宽度必须 text-overflow: ellipsis/clip; //省略号或裁剪: white-space: nowrap;//强制内容在一行显示; ...

  9. (轉)CSS 单行溢出文本显示省略号...的方法(兼容IE FF)

    轉自:http://www.cnblogs.com/hlz789456123/archive/2009/02/18/1392972.html html代码:<div><p>&l ...

随机推荐

  1. 对springMVC的简单理解

    spring框架以及MVC思想: 一:spring框架:spring框架是一种很优秀的框架,它可以帮助开发人员简化组件与组件之间耦合,管理对象.1:创建对象和管理对象之间的关系,可以在配置文件通过be ...

  2. [CSS][转载]内层div的margin-top影响外层div

    参考 内层div的margin-top影响外层div——引出外边距合并 div嵌套导致子区域margin-top失效不起作用的解决方法 我使用的是在外层的div中添加 border: 1px soli ...

  3. MyEclipse build path修改问题

  4. ###《High-level event recognition in unconstrained videos》

    Author: Yu-Gang Jiang, Shih-Fu Chang 事件检测的目标就是自动识别给定视频序列中的感兴趣事件.进行视频事件检测通常很困难,特别是在网络中非限制的视频.在非限制情况下, ...

  5. iOS开发——https+证书

    由于公司项目的需要,经过调研后,已成功. 同事已把此问题写成博客<[加密解密]HTTPS>,我就直接转用了 附带链接如下: http://www.jianshu.com/p/8351917 ...

  6. iOS崩溃日志分析

    Incident Identifier: 55864905-937C-4172-B435-2ACA13D3070ECrashReporter Key: b85cab13431711060a5fab55 ...

  7. 工作“触雷”经历与总结--记博弈论的应用

    工作三年,职场受挫.一些值得说或者不值得说的事情,也懒得去记录.无奈,更多时无奈.内心的骄傲或者自负也不值得炫耀.天生骄傲,或者也只是自身内心的呐喊.毕竟,骄傲的人也不会说出来,搞的好像是有点似得. ...

  8. 通过google找网站后台的方法

    转自:http://cyuyanbiancheng.blog.hexun.com/69239903_d.html site:url.com '查看这个站点上的信息最好不加www,可以查看到不少的二级域 ...

  9. nodejs连接MySQL数据库

    在github上搜索orm2 https://github.com/dresende/node-orm2: 在项目文件夹使用npm install orm下载下来,然后书写配置文件 var orm = ...

  10. IO流01_File类

    [分类] Java的IO通过java.io包下的类和接口来支持. 1.按照流向: 输入流     输出流 2.按照操作数据的大小: 字节流( 8位字节 )     字符流( 16位字节 ) 3.按照角 ...