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>
Atas ialah kandungan terperinci css ellipsis不起作用怎么办. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!