欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

文字溢出隐藏后添加省略号

程序员文章站 2022-05-21 11:30:41
...
当我们想让文字溢出后隐藏并添加省略号的效果

在当前容器或父容器必须要设置宽度,否则代码会失效。 

.box{
         width:50%;
         text-overflow :ellipsis;/* 文字隐藏后添加省略号 */
         white-space : nowrap;/* 强制不换行 */
         overflow : hidden;/*自动隐藏文字*/
         width: 20em;/*不允许出现半汉字截断*/
    } 

以上就是文字溢出隐藏后添加省略号的详细内容,更多请关注其它相关文章!