CSS中的"省略"通常指的是文本溢出时的省略(ellipsis)。这是一个很常见的需求,特别是在处理长段落文本或者是标题文本时。CSS提供了一个属性text-overflow
来实现这个功能。
以下是一个简单的例子,展示如何使用CSS来实现文本溢出时显示省略号(...):
.ellipsis {
white-space: nowrap; /* 确保文本在一行内显示 */
overflow: hidden; /* 隐藏溢出的内容 */
text-overflow: ellipsis; /* 使用省略号表示文本溢出 */
}
<div class="ellipsis">
这是一段很长的文本,当文本超过容器的宽度时,剩余的文本会被省略号代替。
</div>
在这个例子中,.ellipsis
类应用于一个div
元素,当文本内容超出div
的宽度时,溢出的部分会被省略号(...
)代替。