text-overflow:ellipsis

对溢出文本显示省略号有两个好处,

一是不用通过程序限定字数 二是有利于SEO。

需要使用对对溢出文本显示省略号的通常是文章标题列表,这样处理对搜索引擎更友好,因为标题实际上并未被截字,而是局限于宽度而未被显示而已。

通常的做法是这样的:

  1. /*通常的做法是这样的:*/
  2. overflow:hidden;
  3. text-overflow:ellipsis;
  4. -o-text-overflow:ellipsis;
  5. white-space:nowrap;
  6. width:100%;
  1. /*例子*/
  2. .ccname{
  3. display:inline-block;
  4. text-overflow:ellipsis;
  5. max-width:50%;
  6. overflow:hidden;
  7. white-space:nowrap;
  8. font-weight:bold;
  9. }

部分摘抄自:http://zhidao.baidu.com/link?url=Z8Iu-HcG9XgTxD_VFmIqOsqxlI-cMJzEjj9oGdXv0kotabs373ck_Ynyxu8OxL8MJrXz0xNGXa-qJpC6xMe-y_

text-overflow:ellipsis ,溢出文本显示省略号的更多相关文章

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

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

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

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

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

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

  4. 使用text-overflow:ellipsis对溢出文本显示省略号有两个好处

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

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

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

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

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

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

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

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

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

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

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

随机推荐

  1. 国内Ubuntu镜像源

    国内有很多Ubuntu的镜像源,包括阿里的.网易的,还有很多教育网的源,比如:清华源.中科大源. 我们这里以中科大的源为例讲解如何修改Ubuntu 18.04里面默认的源. 编辑/etc/apt/so ...

  2. PipelineDB 1.0.0 发布——使用标准的pg 扩展开发模型

    PipelineDB 1.0.0 发布已经发布了,现在的已经成为一个标准的pg 扩展了,语法也有变动 create continous view 修改为了view,create streaem 修改为 ...

  3. 转 Katana 项目入门

    Katana 项目入门 Howard Dierking 当 ASP.NET 首次在 2002 年发布时,时代有所不同. 那时,Internet 仍处于起步阶段,大约有 5.69 亿用户,每个用户平均每 ...

  4. zmediaboard-Hi3518参数及配置

    1.12_13.uboot的烧写和flash分区1_21.12.1.裸机烧录uboot(1)什么叫裸机烧录?设备是空白的,未经烧录的,就叫裸机.(2)裸机烧录一个设备有2种方案:1是用外部烧录器来烧录 ...

  5. RESTful 知识点

    REST(英文:Representational State Transfer,简称REST) 对于资源的具体操作类型,由HTTP动词表示. 常用的HTTP动词有下面五个(括号里是对应的SQL命令). ...

  6. css 通用兄弟选择器( ~ )

    stylus设置兄弟元素样式: 鼠标浮动在 .video-li 元素上时,.video-li 兄弟中 .video-info 下的 .word 显示. .video-li &:hover ~ ...

  7. Visual Studio2010不能安装Silverlight4_Tools,提示语言不一致

    天在装Silverlight4_Tools时出现“必须先安装与 Silverlight Tools 4 语言版本相一致的 Visual Studio 2010.Visual Web Developer ...

  8. java 环境变量与安装目录

    JDK安装完成后有如下文件夹 bin:存放JDK的各种工具命令,如javac.java等命令. jre:运行java程序所必须的JRE环境 lib:JDK工具命令的实际执行程序,如tools.jar中 ...

  9. Jsp Cookie

    cookie它是用户访问Web服务器时,服务器在用户硬盘上存放的信息. 1.使用Servlet实现cookie @WebServlet("/CookieServlet") publ ...

  10. Angular 4 路由时传递数据

    路由时传递数据的方式有 1. 在查询参数中传递数据 2. 在路由路径中传递参数 3. 在路由配置中传递参数 一.在查询参数中传递数据 在前一节的基础上,我们增加路由数据传递 2. 接收参数的地方 3. ...