css3控制标题字数超出的部分自动显示为“...”省略号
css3功能强大,可以让超出指定宽度的部分自动显示为“...”
代码如下
display:block;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;width:20px;
注意:
1、这个必须是块元素才能实现效果;width是控制显示的宽度的,根据自己的需要做修改;
2、text-overflow:ellipsis;溢出的部分显示省略符号来代替
3、white-space:nowrap;文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。
4、overflow:hidden;溢出隐藏,这个大家应该都知道。
优点:有利于优化,因为虽然网页不显示,但是源代码中是有万整的标题,有利于SEO。兼容性比较高。

css3控制标题字数超出的部分自动显示为“...”省略号的更多相关文章
- css控制标题长度超出部分显示省略号
width: 50px; overflow:hidden;white-space:nowrap; text-overflow:ellipsis; 设置或检索是否使用一个省略标记(...)标示对象内文本 ...
- css控制文本单行或者多行溢出显示为省略号...
p:first-child { background-color: pink; width: 150px; line-height: 28px; font-size: 20px; overflow: ...
- 如何使用css和jquery控制文章标题字数?
如何使用css控制文章标题字数? 最佳答案 控制文章标题字数,不是动态网页的专利,如果静态页面使用CSS样式,也可以实现相同的效果! 看这个例子,你们可以复制到记事本保存为HTML文件看效果! < ...
- 怎么实现CSS限制字数,超出部份显示点点点.
如何实现CSS限制字数,超出部份显示点点点... <div style="width:200px; white-space:nowrap;overflow:hidden;text-ov ...
- destoon控制标题长度,title中显示全标题 标题字符长度怎么控制?
如题商品调用出来后,标题的字符长度怎么控制?有哪位高手能帮我解决吗? 小弟在此感谢了. &length=30 //30表示30个字节 <!--{tag("moduleid=5& ...
- CSS限制字数,超出部份显示点点点...
最近项目中需要用CSS实现限制字数,超出部份显示点点点...,只需要一下代码即可: width:400px;/*要显示文字的宽度*/ text-overflow :ellipsis; /*让截断的文字 ...
- css文字超出自动显示省略号
只针对单行文本有效: 01.针对块状元素 ul li{ width: 180px; text-overflow: ellipsis; white-space: nowrap;/*禁止自动换行*/ ov ...
- DT图库列表修改内容标题字数
dt限制标题字数的方法有几种,最简单的是一种是: {dsubstr($t[title], 42, '..')} 还有一种是列表输出,也是网上常用的方法 <!--{tag("module ...
- css3控制字体动态变换颜色
css3控制字体动态变换颜色 <!doctype html> <html> <head> <meta charset="utf-8"> ...
随机推荐
- Android——SharedPreferences
SharedPreferences是一种轻型的Android数据存储方式,用来保存应用的一些常用配置. 实现SharedPreferences存储的步骤如下: 1.根据Context获取SharedP ...
- iOS中为什么block用copy属性
1. Block的声明和线程安全Block属性的声明,首先需要用copy修饰符,因为只有copy后的Block才会在堆中,栈中的Block的生命周期是和栈绑定的,可以参考之前的文章(iOS: 非ARC ...
- mysql忘记root密码解决方法
1.需求 如何找回root密码 2.流程 a.首先停止数据库 b.在mysqld进程配置文件中添加skip-grant-tables, c.重启数据库 d.改root密码,不用密码直接登录mysql ...
- 项目vue2.0仿外卖APP(二)
vue-cli开启vue.js项目 github地址:https://github.com/vuejs/vue-cli Vue.js开发利器vue-cli,是vue的脚手架工具. 在工地上,脚手架是工 ...
- zabbix触发器依赖
触发器依赖 Zabbix - Router1 - Router2 – Host 如果router1宕机了,那么router2和host都不能连上,这样的话就会发router1.router2和host ...
- JSon解析
1.解析总是犯糊涂 在图中,[] 中括号表示是jsonarray,{} 小括号 表示对象 这个解析可以写成: JSONArray array=new JSONArray(result); for( ...
- Mac Vim + ctags 实现多目录跳转
set tags=tags; set autochdir :wq保存. 在源码根目录中输入ctags -R命令.后重启vim,打开src文件,就能使用Ctrl+] 或 g Ctrl+] 来实现跳转了. ...
- 设计模式--享元模式Flyweight(结构型)
一.享元模式 在一个系统中如果有多个相同的对象,这些对象有部分状态是可以共享的,我们运用共享技术就能有效地支持大量细粒度的对象. 二.例子 举个围棋的例子,围棋的棋盘共有361格,即可放361个棋子. ...
- 在Eclipse中集成Ant配置
提要:本文将向你展示如何使用Eclipse设置为Ant所用的属性值和环境变量,并简要分析如何配置Ant编辑器以便从Eclipse内部操作Ant文件. 一. 修改Ant Classpath 在使用一个可 ...
- C# IEnumberable & IQueryable 区别
转自 http://blog.csdn.net/daimeisi123/article/details/46976093 在应用到IEnumberable 和IQueryable两个接口时,代码往往很 ...