这篇文章主要介绍了强制文本在一行内显示,多余字符使用省略号,设置或检索是否使用一个省略标记(...)标示对象内文本的溢出。对应的脚本特性为textOverflow

设置或检索是否使用一个省略标记(...)标示对象内文本的溢出。对应的脚本特性为textOverflow。

复制代码

代码如下:

<div style="width:100px;height:20px;text-overflow:ellipsis; white-space:nowrap; overflow:hidden; ">a b c d e f g h i j k l , msa sd sd sa w df f </div> 

text-overflow属性仅是注解,当文本溢出时是否显示省略标记。并不具备其它的样式属性定义。我们想要实现溢出时产生省略号的效果。还必须定义:强制文本在一行内显示(white-space:nowrap)及溢出内容为隐藏(overflow:hidden)。只有这样才能实现溢出文本显示省略号的效果。

一、仅定义text-overflow:ellipsis; 不能实现省略号效果。  

二、定义text-overflow:ellipsis; white-space:nowrap; 同样不能实现省略号效果  

三、同时应用: text-overflow:ellipsis; white-space:nowrap; overflow:hidden; 可实现所想要得到的溢出文本显示省略号效果:

Tag:一行内显示   多余字符   省略号

原文:http://www.jb51.net/css/146134.html

CSS强制文本在一行内显示若有多余字符则使用省略号表示的更多相关文章

  1. CSS控制文本在一行内显示,若有多余字符则使用省略号表示

    强制文本在一行内显示,多余字符使用省略号 text-overflow: ellipsis; overflow: hidden; white-space: nowrap;

  2. 用CSS让字体在一行内显示不换行(收藏)

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

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

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

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

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

  5. CSS+DIV实现文字一行内显示,并且过多的文字以点来代替

    有些时候我们在使用CSS+DIV进行排版实现大量的文字的时候,为了页面的美观,这里需要将文字在div中一行显示,并且将过多的文字进行隐藏,以点号进行代替.当鼠标放上面的时候会以title的形式显示所有 ...

  6. css让文字在一行内显示

    1.例如 p元素,里面的文字不换行显示,超出部分不隐藏 p{ width:100px; word-break:keep-all; white-space:nowrap; } 2.例如 p元素,里面的文 ...

  7. CSS实现文本超过指定长度显示省略号

    <style type="text/css"> li { width:200px;/*宽度,超过即会溢出*/ line-height:25px;/*设置行间距*/ te ...

  8. white-space norma nowrap强制同一行内显示所有文本文字,让所有文字内容中一排显示不换行

    日常我们为了让文字内容在一行内显示完,哪怕宽度不够也不能换行,我们可以使用white-space样式,但如果遇到了html br强制换行标签,无论是设置white-space与否都会被<br&g ...

  9. CSS浮动属性,知道原理就很简单,灵活控制块级元素在一行内显示

    在页面布局中,有两个非常常用的CSS属性.它们巧妙的控制着块级元素们之间的位置,灵活的让块级元素在一行内显示或者另起一行.说到这里,相信大家已经猜出来了,这两个属性就是控制块级元素浮动的属性.整个页面 ...

随机推荐

  1. c fopen文件读写

    fopen <cstdio> FILE * fopen ( const char * filename, const char * mode ); Open file Opens the ...

  2. ADF_Advanced ADF系列1_Fusion应用的客制和个性化(Part1)

    2015-02-17 Created By BaoXinjian

  3. hdu 5698 瞬间移动(排列组合)

    这题刚看完,想了想,没思路,就题解了 = = 但不得不说,找到这个题解真的很强大,链接:http://blog.csdn.net/qwb492859377/article/details/514781 ...

  4. NeHe OpenGL教程 第三十课:碰撞检测

    转自[翻译]NeHe OpenGL 教程 前言 声明,此 NeHe OpenGL教程系列文章由51博客yarin翻译(2010-08-19),本博客为转载并稍加整理与修改.对NeHe的OpenGL管线 ...

  5. poj 2567 Code the Tree 河南第七届省赛

    Code the Tree Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 2350   Accepted: 906 Desc ...

  6. Linux tar指令

    linux 下的命令真是太多了.最近在看<Linux Shell编程从初学到精通>一书.该书有468页,很可惜我并不是那种很有耐性一个例子一个例子地跟着做的人,最多在看到些不太清楚的地方会 ...

  7. 在Where中对列使用函数,将导致其不可索引

    在Sql语句的Select部分对字段编写标量函数是完全可以的,但是下面代码: select EmpNo,LastName from Emp 应当写为 select EmpNo,LastName fro ...

  8. centos更改默认语言

    centos7以下版本: vim /etc/sysconfig/i18n 7以上版本:

  9. 下载文件的一种简单方法js

    我在做的一个项目有一部分要下载附件,可是我们公司用了一个包和网上的用response的解决方法冲突,而网上的js解决方法又用到了ActiveXObj我们经理不让用这个.还好我一个同事很利害用了一个很简 ...

  10. Java高级开发工程师