微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

css如何让文字显示最后一行

CSS是一种非常强大的样式语言,可以实现各种各样的效果包括文字显示在最后一行。 要实现这个效果,需要使用CSS中的文本对齐属性text-align和文本溢出属性text-overflow。 首先,在p标签添加以下样式:

css如何让文字显示最后一行

p{
    text-align:justify;
    text-overflow:ellipsis;
    overflow:hidden;
    display:-webkit-Box;
    -webkit-line-clamp:2;
    -webkit-Box-orient:vertical;
}
其中,text-align属性用于设置文本对齐方式为两端对齐,text-overflow属性用于设置超出部分的省略符号为省略号,overflow属性用于设置超出部分隐藏不显示display属性设置为webkit-Box,-webkit-line-clamp属性设置为2,-webkit-Box-orient属性设置为竖向排列。 通过以上属性的设置,可以实现让文字显示在最后一行的效果。当p标签中的文字超出一行时,超出部分将被隐藏,并以省略号代替。 总之,通过CSS的简单设置,让文字显示在最后一行是非常容易的,只需要灵活运用相关属性即可。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。