CSS中如何将超出的文本隐藏并用省略号代替

互联网 18-11-24

在CSS中文本超出可以使用overflow：hidden来隐藏以及CSS中的text-overflow属性给隐藏部分添加省略号

html代码

p{ width:300px; height:30px; border: 1px solid #ccc; text-align: center; font-size: 12px; line-height:30px; } </style> </head> <body> <p>php中文网提供大量免费、原创、高清的php视频教程,并定期举行公益php培训!可边学习边在线修改示例代码,查看执行效果! php从入门到精通,一站式php自学平台!</p>

text-overflow 属性

规定当文本溢出包含元素时发生的事情，它是CSS3中的属性，它有三个值分别为

clip:修剪文本，将超出部分删除

text-overflow:clip; overflow:hidden; white-space:nowrap;规定段落中的文本不进行换行

ellipsis:用省略号来代替被删除的内容

text-overflow:ellipsis; overflow:hidden; white-space:nowrap;

当鼠标放上时被隐藏的字显示

overflow:visible;

总结：以上就是本篇文章的全部内容了，希望对大家有所帮助。

以上就是CSS中如何将超出的文本隐藏并用省略号代替的详细内容，更多内容请关注技术你好其它相关文章！

来源链接：

免责声明：
1.资讯内容不构成投资建议，投资者应独立决策并自行承担风险
2.本文版权归属原作所有，仅代表作者本人观点，不代表本站的观点或立场

标签： text-overflow

CSS中如何将超出的文本隐藏并用省略号代替

相关资讯

标签推荐