css设置文本省略号
时间: 2023-11-14 07:05:51 浏览: 97
css文本显示省略号样式文件
要设置文本的省略号显示,可以使用以下三个CSS属性:
1. overflow: hidden; - 设置溢出部分隐藏
2. white-space: nowrap; - 设置文本不换行
3. text-overflow: ellipsis; - 使用省略号表示被剪切的文本
例如,你可以在一个div元素中使用这些属性来实现文本省略号显示:
```html
<style>
div {
white-space: nowrap;
width: 100px;
overflow: hidden;
text-overflow: ellipsis;
border: 1px solid #000000;
}
</style>
<div>
这是一个测试文本 'overflow:ellipsis'
</div>
```
另外,你也可以在input元素中使用这些属性来实现文本省略号显示:
```html
<input style="text-overflow: ellipsis;" value="这是一个测试文本 overflow:ellipsis" />
```
阅读全文