This commit is contained in:
fanxb 2019-06-21 13:48:55 +08:00
parent ccd7e3beac
commit 40104d978f

View File

@ -0,0 +1,24 @@
---
id: "20190507"
date: 2019/05/07 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;
```