84669 orang belajar
152542 orang belajar
20005 orang belajar
5487 orang belajar
7821 orang belajar
359900 orang belajar
3350 orang belajar
180660 orang belajar
48569 orang belajar
18603 orang belajar
40936 orang belajar
1549 orang belajar
1183 orang belajar
32909 orang belajar
使用了
p.titleholder { font-family: ms sans serif, arial; font-size: 8pt; width: 100; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
如何在鼠标移上时,或者使用其他方式来显示完整信息?
认证高级PHP讲师
最简单的做法,给标签增加title属性,并赋上要显示的内容。
title
<p title="全部内容">部分内容</p>
p.titleholder:hover { text-overflow:inherit; overflow: visible; white-space: pre-line; }
http://www.w3school.com.cn/tiy/t.asp?f=css3_text-overflow_hover
p.titleholder:hover { overflow: visible; }
不太確定這樣的效果是否是您要的?
是这样么?
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> p { width:100px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } p:hover { width:auto; } </style> </head> <body> <p>算哒垃圾死分拉萨机aldj都是sd</p> </body> </html>
加个 title 属性~
如果title的默认样式不符合产品预期的话,自定义是个不错的选择;看 demo
直接写多个class 在鼠标经过的时候添加上该class,去除超出显示省略号的样式就行了
最简单的做法,给标签增加
title
属性,并赋上要显示的内容。p.titleholder:hover {
text-overflow:inherit;
overflow: visible;
white-space: pre-line;
}
http://www.w3school.com.cn/tiy/t.asp?f=css3_text-overflow_hover
不太確定這樣的效果是否是您要的?
是这样么?
加个
title
属性~如果title的默认样式不符合产品预期的话,自定义是个不错的选择;看 demo
直接写多个class 在鼠标经过的时候添加上该class,去除超出显示省略号的样式就行了