25 lines
599 B
Markdown
25 lines
599 B
Markdown
---
|
||
id: "20190621"
|
||
date: 2019/06/21 10:58:00
|
||
title: "antd组件中table设置单行显示"
|
||
tags: ["react", "antd", "table"]
|
||
categories:
|
||
- "前端"
|
||
- "react"
|
||
---
|
||
|
||
今天在开发中遇到了这样一个问题,antd 的 table 组件,在内容太多时会折行显示,如何才能让它不折行并且用省略号显示超出内容呢?
|
||
|
||
可以同给给单元格设置这样的 css 来达到效果:
|
||
|
||
```css
|
||
/* 设置最大宽度,不能用width */
|
||
max-width: 133px;
|
||
/* 不折行 */
|
||
white-space: nowrap;
|
||
/* 超出部分隐藏 */
|
||
overflow: hidden;
|
||
/* 显示... */
|
||
text-overflow: ellipsis;
|
||
```
|