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. (转)RVA-相对虚拟地址解释

    RVA是相对虚拟地址(Relative Virtual Address)的缩写,顾名思义,它是一个“相对”地址,也可以说是“偏移量”,PE文件的各种数据结构中涉及到地址的字段大部分都是以RVA表示的. ...

  2. js声明json数据,打印json数据,遍历json数据

    1.js声明json数据: 2.打印json数据: 3.遍历json数据 //声明JSON var json = {}; json.a = 1; //第一种赋值方式(仿对象型) json['b'] = ...

  3. java @ResponseBody返回值中去掉NULL字段

    需要同时添加两个位置: 1.annotation-driven过滤 <mvc:annotation-driven> <mvc:message-converters register- ...

  4. Java 判断文件夹、文件是否存在、否则创建文件夹

    1.判断文件是否存在,不存在创建文件 File file=new File("C:\\Users\\QPING\\Desktop\\JavaScript\\2.htm"); if( ...

  5. Frameset的使用

    一.frameset 1. 属性 ①border 设置框架的边框粗细. ②bordercolor 设置框架的边框颜色. ③frameborder 设置是否显示框架边框.设定值只有0.1:0 表示不要边 ...

  6. java中的运算符

    1.      赋值运算符:  (=) 2.      算术运算符:  (+ ,- , * , /, %) 3.      逻辑运算符:  (&& ,||, !) 4.      关系 ...

  7. __doPostBack()没有定义解决方法(转)

    有的时候想在客户端触发服务器端控件的click事件 我们这么写__doPostBack('id','') 但是为什么有的时候会失效? 因为__doPostBack()函数并没有在页面产生(如果没有类似 ...

  8. c++学习--面向对象一实验

    实验内容 一 建立类cylinder,cylinder的构造函数被传递了两个double值,分别表示圆柱体的半径和高度.用类cylinder计算圆柱体的体积,并存储在一个double变量中.在类cyl ...

  9. 你还记得windows workflow foundation吗

    很多年前,windows workflow foundation还叫WWF,而直译过来的名称让很多人以为它就是用来开发工作流或者干脆就是审批流的. 博主当年还是个懵懂的少年,却也知道微软不会大力推一个 ...

  10. CountDownLatch如何使用

    正如每个Java文档所描述的那样,CountDownLatch是一个同步工具类,它允许一个或多个线程一直等待,直到其他线程的操作执行完后再执行.在Java并发中,countdownlatch的概念是一 ...