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显示/隐藏方法及2种方法比较原码 - 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. delphi locate多字段查询

    简单格式: IF MSQ_NewBillQuantity.Locate('FStockID;FMarchID', VarArrayOf([FStockID, FMarchID]), []) = Fal ...

  2. Kylin Java RESTful API

    最近在做大数据方面的开发, 学习研究了一段时间的kylin系统, 对于前端开发需要使用 RESTful API ,但是官网并没有提供详细的Java  API. 经过几天的看文档,最终写出了 Java ...

  3. [转载]ARM协处理器CP15寄存器详解

    用于系统存储管理的协处理器CP15  原地址:http://blog.csdn.net/gameit/article/details/13169405 MCR{cond}     coproc,opc ...

  4. vue.js 2.0开发(3)

    组件化 Vue.component('todo-items',{ }); 定义组件,首先是标签的名字todo-items,然后里面还要配置一些选项,首先是我们的模板template,里面需要填入的内容 ...

  5. linux 网卡启动方法

    CentOS 7默认的网卡名称是eno16777736 一般人的是 eth0 编辑配置文件 vi /etc/sysconfig/network-scripts/ifcfg-eno16777736把 O ...

  6. 从委托到Lambda

    写下这篇文章的时候已经是工作三年,突然发现自己从始至终都没有学习过任何东西,突然想学点东西又不知道从何而写那只能一个个基础重新学习. 委托 什么是委托? 委托是一个类,它定义了方法的类型,使得可以将方 ...

  7. C# 系统错误日志处理类

    编写软件,难免会有一些异常,针对异常我们在实际的开发中相比都有一些,捕获异常的处理办法.把软件运行错误信息写成一个 错误日志文件很有必要.当我们在客户那边安装调试时就会更加快捷的,知道错误在哪里.否则 ...

  8. yum命令——安装、卸载、查询等

    --常用命令 1.安装软件 yum install 软件名称 2.卸载软件 yum remove 软件名称 3.更新软件 yum update 软件名称 4.列出所有可安装的软件包 yum list ...

  9. (转)C语言_测试程序运行内存状态GlobalMemoryStatus使用案例

    在做毕业设计的时候,需要验证算法的空间复杂度,C语言网上都说是用GlobalMemoryStatus这个函数,但是网上却没有这个函数的使用实例,也有人说是用内存分析器的东西,但是这个显然是不靠谱的. ...

  10. Row_Number()显示行号

    SELECT *, Row_Number() OVER (partition by deptid ORDER BY salary desc) rank FROM employee Row_Number ...