CSS3 text-overflow 属性
text-overflow是CSS3的一个属性,其作用是当文本溢出包含它的元素时,应该裁剪还是将多余的字符用省略号来表示。
该属性一般和overflow:hidden属性一起使用。
text-overflow: clip|ellipsis|string
语法 text-overflow: clip|ellipsis|string;
clip 修剪文本
ellipsis 使用省略号来代表修剪的文本
string 使用给定的字符串来代表被修剪的文本
white-space:nowrap; //段落中文字不换行
text-overflow: ellipsis; // 多出的内容省略号...
overflow:hidden; //是让多出的内容隐藏起来
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> .dd{ width: 150px; height: 30px; border: 1px solid darkcyan; } .dd p{ font-size: 15px; margin: 0 auto; white-space:nowrap; /*强制不换行*/ text-overflow:ellipsis; /*多出的内容省略号...*/ overflow:hidden; /*多出的内容隐藏起来*/ } </style> </head> <body> <div class="dd"> <p>当文本溢出时,用省略号代替溢出的文本</p> </div> </body> </html>
原文链接:https://www.qiquanji.com/post/8702.html
本站声明:网站内容来源于网络,如有侵权,请联系我们,我们将及时处理。
微信扫码关注
更新实时通知