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超长截断，并显示...的更多相关文章

  1. CSS实现Div透明，而显示在上面的文字不透明，但也可看到显示在下面的图片内容

    CSS实现Div透明,而显示在上面的文字不透明,但也可看到显示在下面的图片内容,DiV透明其实挺简单,主要是为background定义opacity属性,一般这个是最大值是1,数值越接近1,则越不透明 ...

  2. WPF TextBlock 文字超长截断并显示省略符号

    <TextBlock x:Name=" FontSize="9pt" Margin="0 2 0 0 " VerticalAlignment=& ...

  3. css控制div显示／隐藏方法及２种方法比较原码 - czf164的专栏 - 博客频道 - CSDN.NET

    body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...

  4. CSS：使用CSS3将一个div水平和垂直居中显示

    使用css3将一个div水平和垂直居中显示 方案一: div绝对定位水平垂直居中[margin:auto实现绝对定位元素的居中], 代码两个关键点:1.上下左右均0位置定位: 2.margin: au ...

  5. jQuery改变CSS使DIV显示

    HTML: <div id="mazey" style="display:none;">www.mazey.net</div> jQue ...

  6. css：多个div在同一行显示

    使用float:left,也可以使用display : inline-block,可以使多个div在同一行显示. 示例如下: <div class="search_row"& ...

  7. 用CSS让字体在一行内显示不换行（收藏）

    当一行文字超过DIV或者Table的宽度的时候,浏览器中默认是让它换行显示的,如果不想让他换行要怎么办呢? 用CSS让文字在一行内显示不换行的方法   一般的文字截断(适用于内联与块): .text- ...

  8. 用CSS让字体在一行内显示不换行

    青枫 , 2012/07/13 18:08 , css样式设计 , 评论(0) , 阅读(2189) , Via 本站原创 大 | 中 | 小  当一行文字超过DIV或者Table的宽度的时候,浏览器 ...

  9. CSS控制字体在一行内显示不换行

    当一行文字超过DIV或者Table的宽度的时候,浏览器中默认是让它换行显示的,如果不想让他换行要怎么办呢?用CSS让文字在一行内显示不换行的方法: 一般的文字截断(适用于内联与块): .text-ov ...

随机推荐

  1. Python导入自定义包或模块

    一般我们会将自己写的 Python 模块与 Python 自带的模块分开存放以达到便于维护的目的. Python 运行环境在查找模块时是对 sys.path 列表进行遍历,如果我们想在运行环境中添加自 ...

  2. boost相关

    1 boost 常用函数 <1> tcp跟udp的收发函数名 tcp收发 async_write async_read async_read_until udp收发 async_send_ ...

  3. C# 与JAVA 的RSA 加密解密交互，互通，C#使用BouncyCastle来实现私钥加密，公钥解密的方法

    因为C#的RSA加密解密只有公钥加密,私钥解密,没有私钥加密,公钥解密.在网上查了很久也没有很好的实现.BouncyCastle的文档少之又少.很多人可能会说,C#也是可以的,通过Biginteger ...

  4. sqlserver获取数据库表结构

    SqlServer获取所有数据库,表,表结构 --获取所有数据库 SELECT * FROM Master..SysDatabases ORDER BY Name --获取test数据库下所有表 us ...

  5. Android 进程通信机制之 AIDL

    什么是 AIDL AIDL 全称 Android Interface Definition Language,即 安卓接口描述语言.听起来很深奥,其实它的本质就是生成进程间通信接口的辅助工具.它的存在 ...

  6. pointer on c

    http://blog.csdn.net/daniel_ice/article/details/6857019 http://www.cppblog.com/cuigang/archive/2008/ ...

  7. .net操作数据库，史上最牛逼的方法,你见过这种方法吗

    免费分享给大家.下载地址在最下面. C# code   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 ...

  8. win7操作系统32位或是64位系统上安装 sql2005 点滴

    在 win7 上这安装 sql2005 ,需要 .netFramewori2.0 框架,更需要 IIS 支持.否则 sqlserver2005 安装 到最后,就会失败,但此时已经在机器上安装了 .ne ...

  9. Oracle中将查询出的多条记录的某个字段拼接成一个字符串的方法

    11g里面用listagg: select listagg(name,',') within (order by id) from table 10g里面用wm_concat:select wm_co ...

  10. jQuery检测滚动条(scroll)是否到达底部

    一.jQuery检测浏览器window滚动条到达底部 jQuery获取位置和尺寸相关函数: $(document).height()    获取整个页面的高度 $(window).height()   ...