css文字超出换行隐藏 |css 两个div距离

.text {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

上述代码通过设置overflow为hidden，让超出容器部分的内容被隐藏，再通过text-overflow:ellipsis让隐藏部分显示省略号，最后通过white-space:nowrap来避免文字自动换行。

需要注意的是，这个属性只对单行文本生效。如果需要多行文本超出隐藏，大家需要使用以下代码：

.text {
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
text-overflow: ellipsis;
}

这段代码中，大家使用了-webkit-box-orient: vertical和-webkit-line-clamp: 3来控制文本行数，同时还有overflow和text-overflow属性控制超出隐藏与省略号。

总的来说，CSS文字超出换行隐藏方法较为简单，但需要大家熟练掌握不同场景下的使用方法。通过灵活运用这个属性，大家可以使得网页的排版更为美观、整齐。