设置p标签的内容超出部分以省略号替换不起作用

今天在设置p标签时,为p标签设置了以下属性:

p {
line-height :70px;
margin-left :10px;
white-space :nowrap ;
width :700px;
text-overflow:ellipsis;
}

发现死活不起作用,连width都不起作用,然后加了个: overflow: hidden; 竟神奇般的好了

时间: 2024-10-16 07:14:55

设置p标签的内容超出部分以省略号替换不起作用的相关文章

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

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

几个简单的css设置问题:div居中,ul li不换行 ,内容超出自动变省略号等

1  div在页面居中的问题 1)position值为relative时(相对定位),css设置属性margin:0 auto;(0 auto,表示上下边界为0,左右则根据宽度自适应相同值,即居中)即可. 2)position值为relative时(绝对定位),css设置属性    text-align:center; left:50%;  margin-left:-500px;(左边距margin-left设置为当前div宽度的一半的负值即可). 代码示例: .page { position:

vue框架下,echarts图表外部容器宽度设置为百分比时内容超出容器以及echarts图表自适应的实现方案

在vue.js框架下,创建echarts图表,当图表的外部容器的宽度设置为百分比时,出现图表内容宽度超出其外部容器的情况,几番调试,得解决方案如下: (备注说明:问题产生的具体原因尚不清晰,后面若知晓了再补充,但是初期解决问题阶段一定不要钻牛角,不是一开始就能或者可以知道真理的) 在创建了echart对象之后,就调用一次echart的resize方法,同时,获取图表数据的方法应该是异步的,如果是初期调试模拟也要用setTimeout延迟一下,0秒即OK了. methods: { ...mapAc

htnl5中设置文本单行显示,超出部分打省略号,鼠标移到文本时alt出全部文本内容

Html代码: 1.<span class="my-span" title="无数无数无数无数无数">机构</span> Css样式: .myspan{ width: 100px; height: 25px; overflow: hidden; display: block; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; } 运行效果:

Div内部的内容超出部分显示省略号(仅仅只有一行内容)

效果如下: css代码: overflow:hidden;white-space: nowrap;text-overflow:ellipsis; 解释:简单理解就是我要把文本限制在一行(white-space: nowrap;),肯定这一行是有限制的(width),并且你的溢出的部分要隐藏起来(overflow: hidden:),然后出现省略号( text-overflow: ellipsis). text-ellipsis是一个特殊的样式,有关解释是这样的:text-overflow属性仅是

DIV内容超出长度显示省略号,鼠标移上自动显示全部内容(EasyUI DataGrid)

如果想把DIV中超出的文本显示成省略号,而不是换行全部显示,有2个办法. 注:本文主要是以EasyUI的DataGrid为案例的,如果是其他场景只要底层是用DIV显示文本的应该都能使用. 首先可以给此DIV指定3个关键样式{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;} 指定样式后,文本超长已经会显示省略号了.如果想鼠标移上去显示全文的话,有2个办法: 一个是把全部文本写在div的title属性里面,还有一个办法是在原

Html内容超出标记宽度后自动隐藏

我们在显示长文本时,往往需要去在C#端去截取字符,但这绝对不是一个好方面,因为我们的长文本往往都是代HTML标记的,你一个载不好,就会出现乱码问题(出现半个HTML标记),而比较好的作法就是通过CSS去实现这个功能 span标签 当内容超出 强制不断行 自动换行white-space:nowrap; white-space:norma; display:inline-block; 超出自动隐藏 英方不断行显示 (必须在块元素内)overflow:hidden; white-space:nowra

Html table 内容超出显示省略号

内容超出显示省略号: <html> <style> table { table-layout: fixed; width: 100%; } table, th, td { border: 1px solid #999; padding: 5px; text-align: left; } td.desc { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } </style> <tabl

css中a标签内容超出最大字数隐藏处理

问题:a标签内容超出最大字数显示问题 1.超出是最后显示为“...” 2.鼠标放在上面显示完整内容 3.点击新窗口打开链接内容 解决方法: css部分: .list{font:Georgia, "Times New Roman", Times, serif;font-size:14px;width:200px;display:block;overflow:hidden;word-break:keep-all;white-space:nowrap;text-overflow:ellips