CSS实现DIV超长截断,并显示...
DIV显示内容有时会超长,并把页面撑的很难看,
以前的做法是在JS中,或者后台判断其长度,过长就截断,
但由于中英文数字展示的宽度并不一样,截断的长度也就只能取最小值,
展示的效果也不好。利用CSS提供的方法,可以完美的解决该问题。
.project-Name{
width:280px;
overflow:hidden;
text-overflow:ellipsis;
white-space: nowrap;
}
这里宽度是必须定义的,
overflow:hidden;表示超长部分不显示
text-overflow:ellipsis;表示超长显示...
white-space: nowrap;表示不折行显示 该样式也可以应用于其他一些标签,最好在可以加TITLE的标签上使用,
因为可以加TITLE显示全部的信息哦
CSS实现DIV超长截断,并显示...的更多相关文章
- CSS实现Div透明,而显示在上面的文字不透明,但也可看到显示在下面的图片内容
CSS实现Div透明,而显示在上面的文字不透明,但也可看到显示在下面的图片内容,DiV透明其实挺简单,主要是为background定义opacity属性,一般这个是最大值是1,数值越接近1,则越不透明 ...
- WPF TextBlock 文字超长截断并显示省略符号
<TextBlock x:Name=" FontSize="9pt" Margin="0 2 0 0 " VerticalAlignment=& ...
- css控制div显示/隐藏方法及2种方法比较原码 - czf164的专栏 - 博客频道 - CSDN.NET
body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...
- CSS:使用CSS3将一个div水平和垂直居中显示
使用css3将一个div水平和垂直居中显示 方案一: div绝对定位水平垂直居中[margin:auto实现绝对定位元素的居中], 代码两个关键点:1.上下左右均0位置定位: 2.margin: au ...
- jQuery改变CSS使DIV显示
HTML: <div id="mazey" style="display:none;">www.mazey.net</div> jQue ...
- css:多个div在同一行显示
使用float:left,也可以使用display : inline-block,可以使多个div在同一行显示. 示例如下: <div class="search_row"& ...
- 用CSS让字体在一行内显示不换行(收藏)
当一行文字超过DIV或者Table的宽度的时候,浏览器中默认是让它换行显示的,如果不想让他换行要怎么办呢? 用CSS让文字在一行内显示不换行的方法 一般的文字截断(适用于内联与块): .text- ...
- 用CSS让字体在一行内显示不换行
青枫 , 2012/07/13 18:08 , css样式设计 , 评论(0) , 阅读(2189) , Via 本站原创 大 | 中 | 小 当一行文字超过DIV或者Table的宽度的时候,浏览器 ...
- CSS控制字体在一行内显示不换行
当一行文字超过DIV或者Table的宽度的时候,浏览器中默认是让它换行显示的,如果不想让他换行要怎么办呢?用CSS让文字在一行内显示不换行的方法: 一般的文字截断(适用于内联与块): .text-ov ...
随机推荐
- 关于Winform 2.0以后多线程不能更新UI的办法
DotNet 2.0以后Winform在多线程Debug模式下更新UI会报这个错: 线程间操作无效: 从不是创建控件"XXX"的线程访问它. 解决办法如下: 1.在Winform的 ...
- HDU 1166 敌兵布阵(线段树单点更新)
敌兵布阵 单点更新和区间更新还是有一些区别的,应该注意! [题目链接]敌兵布阵 [题目类型]线段树单点更新 &题意: 第一行一个整数T,表示有T组数据. 每组数据第一行一个正整数N(N< ...
- 数据库 PSU,SPU(CPU),Bundle Patches 和 Patchsets 补丁号码快速参考 (文档 ID 1922396.1)
数据库 PSU,SPU(CPU),Bundle Patches 和 Patchsets 补丁号码快速参考 (文档 ID 1922396.1)
- apache配置Allow详解及25个常见问题
http://www.cnblogs.com/top5/archive/2009/09/22/1571709.html apache常见25个问题:http://blog.csdn.net/keda8 ...
- 一次性插入多条sql语句的几种方法
第一种:通过 insert select语句向表中添加数据 从现有表里面把数据插入到另外一张新表去前提必须先有test_2表的存在,并且test_2表中的列的数据类型必须和test表里面列的数据类型一 ...
- RestoreDirectory 引起的BUG
IIRC, in windows XP when you press Save on a SaveFileDialog (or Open on a OpenFileDialog) the direct ...
- 解决oracle 中文入库是乱码的问题
增加两个环境变量: LANG=zh_CN.GBK NLS_LANG = SIMPLIFIED CHINESE_CHINA.ZHS16GBK
- 让VS 2010在调试字符串时,支持Json数据格式友好显示
阅读本文如果对Microsoft.VisualStudio.DebuggerVisualizers的用法不熟悉的,可以参考这篇文章.http://www.cnblogs.com/devil0153/a ...
- onethink上传图片(资源)和预览
直接上干货 不废话了 普通上传: onthink框架 后台已经有图片和文件上传功能 controller里只需: public function addPicture(){ /* 调用文件上传组件上 ...
- go read text file into string array
http://stackoverflow.com/questions/5884154/golang-read-text-file-into-string-array-and-write 方法一 pac ...