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"> ...
随机推荐
- Jni :三维数组处理方法 ,以整形三维数组为例 C++实现
本文原创,转载请注明地址:http://www.cnblogs.com/baokang/p/4982846.html 关于Jni的基本使用方法,请参阅:Java 调用 C++ (Java 调用 dll ...
- 功能实现:PLC对LPC的音量控制
设计方案1: 在PLC上,当使用QDial调节音量时,触发QDial的SIGNAL:ValueChange(),对应SLOT向LPC发送自定义键码0x22; 在LPC上,当接收到0x22键码时,执行操 ...
- C++编译期间字节序判断
当前常用的字节序一般就两种,大端序和小端序. 下面列出四种字节序的表达方式.在对应平台下,内存布局为{0x,00,0x01,0x02,0x03}的四字节,表示为十六进制的值就如下面代码所示的. END ...
- zabbix自定义key
zabbix自定义key 1.修改客户端配置文件 #vi /opt/zabbix/etc/zabbix_agentd.conf Include=/opt/zabbix/etc/zabbix_agent ...
- Python复习之生成器 generator
生成器 generator def h(): print "hello" m = yield 5 print "m:", m d = yield 12 prin ...
- EndNote(一)之基本介绍
作为一个经常看文献的人,发现看了很多文献,但是之后需要再找某一篇文献的时候,却无法找到文献在哪里了.混乱的文献管理方式,浪费了很多时间在翻阅自己已经看过的文献之中.这是一件很头痛的事情,才想起借助软件 ...
- CentOS 6.3下Samba服务器的安装与配置方法(图文详解)
这篇文章主要介绍了CentOS 6.3下Samba服务器的安装与配置方法(图文详解),需要的朋友可以参考下 一.简介 Samba是一个能让Linux系统应用Microsoft网络通讯协议的软件, ...
- 常用jQuery代码
返回元素的html包括它本身 <div class="test"><p>hello,你好!</p></div> <script ...
- [Sass]局部变量和全局变量
[Sass]局部变量和全局变量 Sass 中变量的作用域在过去几年已经发生了一些改变.直到最近,规则集和其他范围内声明变量的作用域才默认为本地.如果已经存在同名的全局变量,从 3.4 版本开始,Sas ...
- axure rp8.0 序列号,亲测可以用
转载自:https://zhidao.baidu.com/question/428326076480233092.html aaa 2GQrt5XHYY7SBK/4b22Gm4Dh8alaR0/0k3 ...