单行长度过长显示为省略号

今天get 了css新样式:

控制一行一行的文本如果太长,就用省略号显示:

样式如下:

 .myStyle{width:160px;height:50px;line-height:50px;border:4px solid #eee;
        white-space:nowrap;/*强制文本在一行内显示*/
        text-overflow:ellipsis; /*溢出省略号,支持ie、safari(webkit)*/
        -o-text-overflow:ellipsis; /*溢出省略号,支持opera*/
        overflow:hidden;/*溢出隐藏*/
        -moz-binding:url(‘ellipsis.xml#ellipsis‘);/*溢出省略号,支持firefox*/}
<body>
    <div class="myStyle">文本长了就省略号显示文本长了就省略号显示文本长了就省略号显示</div>
</body>

显示效果如下:

时间: 2024-11-10 05:56:11

单行长度过长显示为省略号的相关文章

html文本太长显示为省略号的方法

<a>元素在content比较多的情况下,显示不全,需要省略显示,并且在鼠标停留的时候有全文提示.其实现方法是:css.test{white-space:nowrap;/*不换行*/overflow:hidden;/**/text-overflow:ellipsis;/*超长显示为省略号*/}标签的写法:<a href="#" title="abc">content</a>注意:一点要写title属性,该属性是提示信息.

table td中的内容过长,显示为固定长度,多余部分用省略号显示

简单描述:table数据过长,结果顶到下一格,影响了数据的查看 解决办法: 给table 加上style属性   另外 给td加上style标签修饰 <table class="table table-striped table-bordered table-hover table-checkable order-column" style="table-layout:fixed;" id="table1">  <style&g

Android 文字过长TextView如何自动截断并显示成省略号

当用TextView来显示标题的时候,如果标题内容过长的话,我们不希望其换行显示,这时候我们需要其自动截断,超过的部分显示成省略号. 如下图所示,标题过长,自动换行了,显示不是很好看. 这时候我们需要其自动截断,超过的部分显示成省略号. xml布局里需要将textview的下面属性设置下: android:ellipsize="end" android:singleLine="true" 其中:android:ellipsize="start"-

html文字过长显示省略号

<p style="width: 300px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;"> html文字过长显示省略号,布布扣,bubuko.com

内容过长显示省略号 鼠标悬停显示

<!doctype html> <html> <head> <style type="text/css"> //css控制内容过长显示省略号和悬停时显示全部内容 .li1 { list-style:none; width:200px; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; overflow: hidden; margin-top:5px

CSS自动截断表格内的长字符 以省略号显示

CSS自动截断表格内的长字符,以省略号显示,大家可能在一些网站看到过这样的效果,目的是让表格或布局更美观一些,但是不利于阅读,如果您可以能该属性加上title或链接的话那就利于网站体验了,您说是吗? <!DOCTYPE> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>上谷战

span标签中显示固定长度,超出部分用省略号代替,光标放到文字上显示全部

在span中实现显示某段内容,固定其长度,多余部分用省略号代替,这样就用到html的title属性: 如:<span title="value"></span> title属性:其值是text,属性描述是规定元素的工具提示文本,意思就是鼠标移到元素上时显示title中的内容: 以span为例实现上述功能: html: <div> <span class="basic-l left10">筛选标签:</span&g

报表reportviewer控件使用时,单行文本过长的解决办法

最近在做winform的报表,客户需要把纸质模板可以在系统中打印.一开始设计,认为vs自带控件reportviewer可以解决,但在测试过程中发现:若单行文本过长,报表自动分页,弊端是分页后,第一页文本框底部边框和第二页文本框顶端边框无法显示,由于客户是政府机关,要求严格,只好解决这个问题.在解决过程中也是想各种办法,第一种,判断是否分页,分页后,该文本框是否存在本页,若存在,则在相应分页底部和顶端划线,可是搜索属性框,并没有这些属性值,放弃.第二种,主体加边框,与矩阵重合,矩阵边框不要,使用主

Lua语言实现:截取给定字符串的部分长度,超出部分用省略号“...”替换

在项目开发过程当中,尤其是游戏开发,当使用lua脚本语言编写客户端程序时,需要给玩家角色名长度做适配.如果玩家角色名的长度很长,超过了给定框,那么就会遮住游戏界面其他地方的图片,效果很难看,这样给玩家的体验就不好.为了给用户一个好的体验,往往策划会提出要求,比如角色名最大长度为18位,但是12位就已经超出框框,那么可以只显示9位,剩余部分用省略号替换,这样整个角色名就在给定框当中,给玩家的体验效果就更好. 下面是我在游戏开发遇到的情况. 没有修改前的情形: 策划往往会要求客户端把角色名缩短,但又