antd的Card组件,如何设置底部paddingBottom值为0,直接<Card style={{paddingBottom:'0px'}}>这样写不生效
时间: 2024-03-18 07:39:52 浏览: 223
Android技术知识点:如何实现自定义带有CardView组件的底部滑动栏
可以使用CSS的方式来设置Card组件的底部paddingBottom值为0。具体方法如下:
1. 给Card组件设置一个类名,例如"my-card",代码如下:
```jsx
<Card className="my-card">Card Content</Card>
```
2. 在CSS文件中,使用以下代码来设置底部paddingBottom值为0:
```css
.my-card .ant-card-body {
padding-bottom: 0;
}
```
注意,Card组件的内容被包裹在一个.ant-card-body的div元素中,因此需要通过该元素来设置paddingBottom值为0。
完整代码如下:
```jsx
import React from 'react';
import { Card } from 'antd';
import './style.css';
const MyCard = () => {
return (
<Card className="my-card">
Card Content
</Card>
);
};
export default MyCard;
```
```css
.my-card .ant-card-body {
padding-bottom: 0;
}
```
阅读全文