text-overflow:ellipsis

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

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

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

通常的做法是这样的:

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

部分摘抄自: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. Flask第31课——include标签

    我们在上一节代码基础上增加一些代码,样式: 文件名index.html,代码: {% from 'macros/forms.html' import input %} <!DOCTYPE htm ...

  2. CSS 属性用法备忘录

    ☆ margin: 0; padding: 0; :{ 顺时针 margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: ...

  3. Android USB gadget框架学习笔记

    一 Gadget框架结构 kernel/drivers/usb/gadget,这个目录是android下usbgadget的主要目录. Gadget功能组织单元:主要文件android.c,usb g ...

  4. dbt 基本试用

    dbt 是一个很不错的进行etl 中的t 处理的工具,灵活简单,我们需要写的就是select 语句 dbt 帮助我们进行处理 测试集成了graphql 以及使用docker 运行 安装 pip ins ...

  5. CGI之C语言篇

    为什么要进行CGI编程? 在HTML中,当客户填写了表单,并按下了发送(submit)按钮后,表单的内容被发送到了服务器端,一般的,这时就需要有一个服务器端脚本来对表单的内容进行一些处理,或者是把它们 ...

  6. 寻找高边电流IC

    因为项目需要,无法使用地的电流检测,需要使用高边的电流检测 IC. 搜索的关键字: 高边 电流 高侧 电流 目前找到以下几款: INA199A1,来自参考方案,属于宽电压输入的. INA180B4ID ...

  7. EF Code First Migrations数据库迁移 (转帖)

    1.EF Code First创建数据库 新建控制台应用程序Portal,通过程序包管理器控制台添加EntityFramework. 在程序包管理器控制台中执行以下语句,安装EntityFramewo ...

  8. MySQL性能指标及计算方法(go)

    绝大多数MySQL性能指标可以通过以下两种方式获取: (1)mysqladmin 使用mysqladmin extended-status命令获得的MySQL的性能指标,默认为累计值.如果想了解当前状 ...

  9. Oracle查看及修改Oracle最大连接数

    Oracle查看及修改Oracle最大连接数 .查询oracle的最大连接数: select * from v$parameter where name='processes'; .oracle 11 ...

  10. VS2008项目使用VS2015打开时,出现错误: error CS1012: Too many characters in character literal

    VS2008项目使用VS2015打开时,出现错误: error CS1012: Too many characters in character literal ------------------- ...