css ellipsis不起作用怎么办
程序员文章站
2022-03-15 13:34:36
...
css ellipsis不起作用的解决办法:首先打开css;然后将属性“text-overflow:ellipsis”跟“overflow:hidden;”以及“white-space:nowrap;width:150px;”一起使用即可。
推荐:《css视频教程》
解决Css属性text-overflow:ellipsis 不起作用(文本溢出显示省略号)
使text-overflow:elipsis起作用:
想要使用css属性text-overflow:elipsis起到作用,样式必须跟overflow:hidden; white-space:nowrap;width:150px;一起使用
1、text-overflow语法:
text-overflow : clip | ellipsis
2、text-overflow参数说明:
clip: 不显示省略标记(...),而是简单的裁切
elipsis: 当对象内文本溢出时显示省略标记(...)
3、简单使用:
<!doctype html><html> <head> <meta charset="utf-8"> <title>测试页面</title> </head> <style type="text/css"> .test{ text-overflow:ellipsis; overflow:hidden; white-space:nowrap; width:150px; } </style> <body> <ul id="textFlow"> <li class="test"><a href="#">第一标题:奇艺之旅</a></li> <li class="test"><a href="#" title="第二标题:萨迪斯的项圈的奇闻异事">第二标题:萨迪斯的项圈的奇闻异事</a></li> <li class="test"><a href="#" title="第三标题:杜斯的奇妙之旅。测试数据。测试数据">第三标题:杜斯的奇妙之旅。测试数据。测试数据 </a></li> </ul> </body></html>
以上就是css ellipsis不起作用怎么办的详细内容,更多请关注其它相关文章!
上一篇: windows下PHP运行环境配置
下一篇: 今天遇到的一份面试题
推荐阅读
-
Myeclipse断点不起作用出现斜线该怎么办呢?
-
Windows11开始菜单不起作用怎么办? 开始菜单没反应的解决办法
-
SpringMVC js/css等静态资源引入不起作用问题
-
win11系统无法分屏怎么办? 分屏在Win11中不起作用的解决办法
-
Win11系统登录不了VLSC怎么办?Win11系统VLSC登录不起作用怎么办
-
margin-right 不起作用?_html/css_WEB-ITnose
-
请问这段Tab选项卡的代码为什么不起作用?_html/css_WEB-ITnose
-
ie6设置select下拉列表的属性不起作用_html/css_WEB-ITnose
-
文章换行都没有间距了,怎么办?_html/css_WEB-ITnose
-
高手请进:position:relative占用的空间空白怎么办?_html/css_WEB-ITnose