之前一直尝试用但是总出不来效果,今天写代码又用这个,发现自己用错地方了,(⊙﹏⊙)b.....
先上正确代码
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>text-overflow: ellipsis;</title> 6 </head> 7 <style> 8 .text-overflow { 9 display: inline-block; 10 white-space: nowrap; 11 overflow: hidden; 12 text-overflow: ellipsis; 13 } 14 a{ 15 width:110px; 16 } 17 </style> 18 <body> 19 <a href="#" class="text-overflow">测试文字能否被截取</a><br> 20 <b class="text-overflow" style="width:100px;">测试文字能否被截取</b> 21 </body> 22 </html>
今天是将新闻列表中的溢出文本用“...”代替,第一次发现自己将css样式写到了ul标签中,后来发现写进了li标签中都不能用,最后换到a标签中就可以了,原来作用的是内部的a标签,真马虎
写的html样式是:
<ul><li><a>我是内容</a></li></ul>
时间: 2024-10-05 09:49:10